任何一个节点,都有属性,可以操作
节点类型: 节点.nodeType 执行结果是 一个数值
元素节点 1
属性节点 2
文本节点 3
注释节点 8
节点名称: 节点.nodeName
元素节点 大写英文字母的标签名称
属性节点 属性名称
文本节点 #text
注释节点 #comment
节点内容: 节点.nodeValue
元素节点 null
属性节点 属性值
文本节点 节点中的文本内容
注释节点 注释内容
实际应用
1.元素节点
htmlcssjs
<table>
<tr><!--我是注释内容-->
<td id="john" name="myname">John</td>
<td>Doe</td>
<td id="jack">Jack</td>
</tr>
</table>随便写写 var a = document.getElementById("john");
console.log(a.nodeType); // 1
console.log(a.nodeName); // TD
console.log(a.nodeValue); // null2.属性节点
htmlcssjs
<table>
<tr><!--我是注释内容-->
<td id="john" name="myname">John</td>
<td>Doe</td>
<td id="jack">Jack</td>
</tr>
</table>随便写写 var b = document.getElementById("john").getAttributeNode("name");
console.log(b.nodeType); // 2
console.log(b.nodeName); // name
console.log(b.nodeValue); //myname3.文本节点
htmlcssjs
<table>
<tr><!--我是注释内容-->
<td id="john" name="myname">John</td>
<td>Doe</td>
<td id="jack">Jack</td>
</tr>
</table>随便写写 var c = document.getElementsByTagName("td")[0].firstChild;
console.log(c.nodeType); // 3
console.log(c.nodeName); // #text
console.log(c.nodeValue); // John4.注释节点
htmlcssjs
<table>
<tr><!--我是注释内容-->
<td id="john" name="myname">John</td>
<td>Doe</td>
<td id="jack">Jack</td>
</tr>
</table>随便写写 var d = document.getElementById("tr").firstChild;
console.log(d.nodeType); // 8
console.log(d.nodeName); // #comment
console.log(d.nodeValue); // 我是注释内容
Comments | NOTHING