JS垫脚石-DOM篇1
来源:互联网 发布:young网络客户端wifi 编辑:程序博客网 时间:2024/05/21 14:00
概述
- 当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model),DOM被构造为对象的树
- 通过对象模型,js获得了改变页面中所有HTML元素、HTML属性、CSS样式的能力,能够对页面中所有事件作出反应,从而实现对元素的增删改查操作
获取元素
- 直接查找
-通过id查找 .getElementById(‘id名’),为document特有的函数,只能由document调用
-通过标签名查找 .getElementsByTagName(‘标签名’)
-通过类名查找 .getElementsByClassName(‘类名’) - 关系查找
父子节点
-.children():获取该节点下的所有子元素(非标准属性)
标准浏览器指ie6、7、8
-.childNodes():获取该节点下的所有子元素(标准及ie9以上,会把换行当做空白文本节点解析)
-.parentNode:获取父节点
-.firstChild:获取第一个子节点的元素(会把换行当做空白文本节点解析)
-.firstElementChild:获取第一个子节点的元素(ie8以下没有这个属性)
-.lastChild
-.lastElementChild
兄弟节点
带Element的ie8以下没有这个属性
-.nextElementSibling():获取下一兄弟节点元素
-.previousElementSibling:获取前一兄弟节点元素
-.nextSibling()
-.previousSibling()
节点类型
nodeType属性获取 console.log(a.nodeType);
-元素节点 1
-文本节点 3
-注释节点 8
-属性节点 2(属性结点被存放在一个特殊属性attributes中)
-document节点 9
定位偏移量
- offsetLeft
- offsetTop
元素自身身高
- offsetWidth/offsetHeight
- clientWidth/clientHeight
0 0
- JS垫脚石-DOM篇1
- JS垫脚石-DOM篇2
- JS垫脚石-基础篇
- JS垫脚石-数组篇
- JS垫脚石-字符串篇
- JS垫脚石-DATE篇
- JS垫脚石-BOM篇
- JS垫脚石-冒泡排序
- JS垫脚石-正则表达式
- JS垫脚石-判断浏览器版本
- js DOM篇
- js-DOM[1] 绑定~
- Js DOM编程(1)
- 05-1 JS的DOM
- JS&DOM
- JS&DOM
- JS DOM
- js dom
- 主流JS库一览
- MFC中CString转char *的方法
- __main函数的由来及做了哪些事情(在stm32复位后会调用这个函数)
- JAVA进阶8.7——事件处理(4)鼠标事件
- 关于Linq的ToList(),IEnumerable,IQueryable
- JS垫脚石-DOM篇1
- poi完美word转html(表格、图片、样式)
- Java 之注册表操作
- openbts自启动程序在ubuntu中是如何实现的?
- 使用coe_xfr_sql_profile 绑定执行计划简单练习
- 聚合数据火车票订票接口完成火车票订票流程(PHP)
- 应用发布到Apple store后如何分享给用户下载
- 四六级作文高分仿句来袭,赶快收藏吧————英语
- android 屏幕适配