位置: 编程技术 - 正文
详谈DOM简介及节点、属性、查找节点的方法(简述dom的组成)
编辑：rootadmin推荐整理分享详谈DOM简介及节点、属性、查找节点的方法(简述dom的组成)，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:dom juan,dom结构,dom juan,dom节点有哪些,dom的概念,dom juan,dom juan,dom介绍,内容如对您有帮助，希望把文章链接给更多的朋友！
DOM(Document Object Modle) 操作文档的编程接口
DOM定义了表示和修改文档的方法，不能修改css样式表，在js中使用DOM方法改变元素的css样式，实质上是在元素上添加行间样式。
DOM对象就是宿主对象，用来操作HTML和xml功能对象的集合。 xml——>xhtml——>html4.0——>html5
HTML和xml的区别：除了xml可以自定义标签外基本上没区别，xml被json替代了。
document，单独写的时候，它代表整个文档，隐式的写在html标签的上一层，html只是文档中的根标签。
注意点：BOM、DOM成组的东西都是类数组，而不是数组。
获取元素的方法：
getElementById();
在IE8以下的浏览器不区分id值得大小写，并且匹配元素的name的属性值。由于后台会修改id值，所以尽量不用或少用id。
getElementsByTagName();标签名，所有浏览器都支持
getElementsByClassName(); IE8及其以下得浏览器不支持
getElementsByName(); 在旧版本中，只有能提交请求的标签的name才生效(form、表单元素、img、iframe)
document.querySelector(); css选择器，IE7及以下不兼容，并且不具有实时性。
document.querySelectAll();
节点类型：
元素节点 1
属性节点 2
文本(text)节点 3 // 文本、空格、回车等都是文本节点
注释(comment)节点 8
document节点 9
documentfragment
遍历节点数：
parentNode 子节点的父节点，最终的parentNode节点是document节点。
childNodes 父节点的所有子节点，元素节点、注释节点、文本节点
firstChild 第一个子节点
lastChild 最后一个子节点
nextSibling 下一个兄弟节点
previousSibling 前一个兄弟节点
遍历元素节点数：（除了children节点，其他的都是IE9及以下不兼容）
parentElement 元素的父元素节点，最终的父元素节点是html元素，document是自成节点。
children 父元素下的元素子节点。
node.childElementCount === node.children.length 当前子节点的元素子节点个数。用children.length。
firstElementChild 第一个元素子节点
lastElementChild 最后一个元素子节点
nextElementSibling、previousElemnetSibling
节点的四个属性：
nodeName 除了元素节点，返回的结果前面都有一个‘#'，而元素节点返回大写形式的标签名，类型都为只读。
nodeValue 只用于文本节点和注释节点,可读写。
nodeType 返回数字，该数字代表对应的节点类型。只读
attributes 元素节点的属性集合。
node.hasChildNodes()方法，判断父节点里面是否有子节点，返回结果为布尔值。
以上这篇详谈DOM简介及节点、属性、查找节点的方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持积木网。
javascript Function函数理解与实战 Function函数是javascript的基础也是实现功能的一个引爆点，我们通过实例分析让你对Function函数有一个更加深刻的理解以及在实际中的用法讲解。Function确
如何让你的JS代码更好看易读 作为JS程序员，自己写的代码如果好看易读，不只是自己看起来好看，在别的程序员接手以后，也会是交接工作异常顺利。不要在代码中留大段注释掉的
基于js 字符串indexof与search方法的区别(详解) 1.indexof方法indexOf()方法可返回某个指定的字符串值在字符串中首次出现的位置。语法：注意：有可选的参数（即设置开始的检索位置）。2、search方法sear
标签: 简述dom的组成
本文链接地址:https://www.jiuchutong.com/biancheng/368472.html 转载请保留说明！上一篇：ES6 javascript中class类的get与set用法实例分析
![[置顶]
利用Cocos2dx3.2制作重力版俄罗斯方块（Crazy Tetris）(置顶聊天折叠怎么开启)](/img.jpg)
