JS加强学习-DOM学习03

7. 节点

7.1 节点的组成

.nodeType查看节点的类型（使用阿拉伯数字表示）

.nodeName查看节点的名字

.nodeValue查看节点的值

节点分成：标签节点、属性节点、文本节点、注释节点、文档节点。

标签的节点：

标签的节点类型：  1

标签的节点名字： 对应的标签名字

标签的节点值 ：  null

文本的节点：

文本的节点类型：  3

文本的节点名字： #text

文本节点值：   对应的文本值，如果没有，就是空

属性节点：

属性的节点类型：  2

属性的节点名称： 对应的属性名称

属性的节点值：  对应的属性值

注释节点：

注释的节点类型：  8

文档节点：

文档的节点类型：  9

文档的节点名称： #document

文档的节点值：  null

注意：除文档节点外，每个节点都有父节点。大部分元素节点都有子节点。

7.2 获得父、子节点

7.2.1 获得父节点

parentNode：会直接获取对象的父级元素节点

7.2.2 获得子节点

childNodes：标准的DOM属性，获取子标签节点以外，还会获取子文本节点，但IE8中会忽略空白节点。

children：不是标准的DOM属性，但是所有的浏览器都支持，只会返回元素节点 。

7.3 获得同级节点

当节点分享同一个父节点时，它们就是同辈（同级节点）。

nextSibling：获取对象下一个紧邻节点，不管下一个是否为空白文本节点，chrome 火狐都支持的，IE8及之前的浏览器会忽略空白文本节点，如果文本有内容也会获得到。

nextElementSibling：谷歌和火狐都可以获得下一个紧邻的元素节点，而IE8及之前的版本不支持

previousSibling：获取对象上一个紧邻节点，不管下一个是否为空白文本节点，chrome 火狐都支持的，IE8及之前的浏览器会忽略空白文本节点，如果文本有内容，也会获得到。

previousElementSibling：谷歌和火狐都可以获得下一个紧邻的元素节点，而IE8及之前的版本不支持。

转载于:https://www.cnblogs.com/chendu/p/5747353.html