JavaScript 节点

节点区别

节点类型	节点名称 节点值
元素节点	HTML标签的名称（大写） 1
属性节点	属性的名称，如 id 、class 、name 等 2
文本节点	它的值永远是#text 3
注释节点	为注释内容 8
文档节点	它的值永远是#document 9

获取子节点

childNodes与children

• childNodes：它是标准属性，它返回指定元素的子元素集合，包括HTML节点，所有属性，文本节点。可以通过nodeType来判断是哪种类型的节点，只有当nodeType==1时才是元素节点，2是属性节点，3是文本节点。

• children：非标准属性，它返回指定元素的子元素集合。
  但它只返回HTML节点，甚至不返回文本节点，虽然不是标准的DOM属性，但它和innerHTML方法一样，得到了几乎所有浏览器的支持。

    两者的区别只在于children只获取子元素节点，而childNodes获取所有种类的子节点，包括元素节点，文本节点，注释节点等等。
同时childNodes为js官方方法（javascript参考手册含有该方法），而children为ie封装方法。

子、 父节点

以下方法获取的节点均包括元素节点，文本节点，注释节点等等

• firstChild - 返回第一个子节点；
• lastChild - 返回最后一个子节点；
• parentNode - 返回的节点永远是一个元素节点，因为只有元素节点才有可能有子节点，document节点将返回null；

Node.childNodes  //获取子节点列表NodeList; 注意换行在浏览器中被算作了text节点，如果用这种方式获取节点列表，需要进行过滤
Node.firstChild  //返回第一个子节点
Node.lastChild  //返回最后一个子节点
Node.parentNode// 返回父节点

获取上下节点

以下方法获取的节点均包括元素节点，文本节点，注释节点等等

• nextSibling - 返回目标节点的下一个兄弟节点，如果目标节点后面没有同属于一个父节点的节点，返回null；
• previousSibling - 返回目标节点的前一个兄弟节点，如果目标节点前面没有同属于一个父节点的节点，返回null；

Node.previousSibling    // 返回前一个节点，如果没有则返回null
Node.nextSibling       // 返回后一个节点