SW：HTML DOM

1：节点：nodeType,nodeValue,nodeName

getAttributeNode() 方法从当前元素中通过名称获取属性节点。

元素节点nodeValue是null,属性节点nodeValue是名值

<h1 id="a">123456</h1>
<script>
   var oH1 = document.getElementById("a");  //元素节点1
   var oTxt = oH1.firstChild;               //文本节点3
   var oId = oH1.getAttributeNode("id");    //属性节点2
   //1,3,2
   console.log("nodeType: "+oH1.nodeType+","+oTxt.nodeType+","+oId.nodeType);
   //null,123456,a
   console.log("nodeValue: "+oH1.nodeValue+","+oTxt.nodeValue+","+oId.nodeValue);
   //H1,#text,id
   console.log("nodeName: "+oH1.nodeName+","+oTxt.nodeName+","+oId.nodeName);
</script> 

 

2：children和childNodes区别

chilren返回元素列表（不包含空格,非标准属性但兼容好）：console.log(oDiv.children)

childNodes返回节点列表（不包含空格标准属性HTML DOM）：console.log(oDiv.childNodes)

<div id="aa">
    <h1>123456</h1>
    <p>qwrert</p>
</div>

3：nextElementSibling和nextSibling区别
node.nextSibling/node.nextElementSibling

nextSibling：找下一个节点，以Node对象返回，包含空格（HTML DOM） 找不到返回Null
nextElementSilbing: 找下一个元素节点，不包含空格，但IE8及以下不支持。