DOM节点

什么是节点？

节点就像一颗大树的枝干与树叶，不同的节点对应了不同的功能，比如一颗大树的主干能够支撑起它的枝干，而它的枝干能够生长出树叶，无数的枝干与树叶构成了一颗完整的大树，人常说艺术源于生活，程序也是一门艺术，它本是死气沉沉的，是人的想象力让它有了色彩。

DOM 节点常用的属性

• childNodes
• nodeType
• nodeValue
• firstNode
• lastNode

有了节点，就会有节点所对应的属性，改变这些属性能得到不同的行为和结果

childNodes

childNodes 是一个数组，它包含了某个元素下对应的子节点，虽然这些子节点不一定是对网页的表现力有用，但是在编写中对人是必须的。例如输出 head 节点下的子节点

var head_element = document.getElementsByTagName('head')[0];
console.log(head_element.childNodes);

这些子节点不仅包括元素节点、属性节点、文本节点还有一些换行符和空格。
所以 childNodes 属性能够获取任何一个元素的所有子节点（虽然有些并不是有用的）

nodeType

nodeType 获取的是某一个元素的类型，它一共有12种可取的值，但有用的，或者说有具体表现力只有3种。

• 元素节点（nodeType = 1）
• 属性节点（nodeType = 2）
• 文本节点（nodeType = 3）

w3c: nodeType所有值

nodeValue

nodeValue 能够改变文本节点的值，值得注意的是如果使用 node.nodeValue，通常情况下返回值为 null，所以需要使用 node.childNodes[0].nodeValue 来获取 p 元素的文本节点

<p>Hello, world</p>

firstChild

node.childNodes[0] 价等于 node.firstChild

lastChild

node.childNodes[node.childNodes.length - 1] 价等于 node.lastChild

南无阿弥陀佛，祝你吉祥