- 整个文档是一个文档节点
- 每个 HTML 元素是元素节点
- HTML 元素内的文本是文本节点
- 每个 HTML 属性是属性节点
- 注释是注释节点
先把这5句话吃透了
然后我们看一下下面几个属性：
nodeValue 属性设置或返回指定节点的节点值。(文本节点直接就是 文本)
提示：nodeValue 属性的替代选择是 textContent 属性。
innerHTML 属性
获取元素内容的最简单方法是使用 innerHTML 属性。
innerHTML 属性对于获取或替换 HTML 元素的内容很有用。
nodeName 属性
nodeName 属性规定节点的名称。
- nodeName 是只读的
- 元素节点的 nodeName 与标签名相同
- 属性节点的 nodeName 与属性名相同
- 文本节点的 nodeName 始终是 #text
- 文档节点的 nodeName 始终是 #document
注释：nodeName 始终包含 HTML 元素的大写字母标签名。
nodeType 属性
nodeType 属性返回节点的类型。nodeType 是只读的。
比较重要的节点类型有：
| 元素类型 | NodeType |
|---|---|
| 元素 | 1 |
| 属性 | 2 |
| 文本 | 3 |
| 注释 | 8 |
| 文档 | 9 |
<!DOCTYPE html> <html> <body> <p id="intro">我是一個文本節點 我也是自己結點值 <span>span是個元素节点 我是span的innerHTML 我自己就是一个文本节点！</span> </p> <script> txt=document.getElementById("intro").childNodes[0].nodeName;//獲取第一個子節點(文本节点) document.write("[0]文本节点名：" + txt + "<pre> </pre>"); txt=document.getElementById("intro").childNodes[0].nodeValue;//獲取第一個子節點(文本节点) document.write("[0]文本节点值：" + txt + "<pre> </pre>"); txt=document.getElementById("intro").childNodes[1].nodeName;//獲取第二個子節點(元素节点) document.write("[1]元素节点名："+txt+"<pre> </pre>"); txt=document.getElementById("intro").childNodes[1].nodeValue;//獲取第二個子節點(元素节点) document.write("[1]元素节点值："+txt+"<pre> </pre>"); txt=document.getElementById("intro").childNodes[2].nodeName;//獲取第三個子節點(文本节点) document.write("[2]元素节点名："+txt+"<pre> </pre>"); txt=document.getElementById("intro").childNodes[2].nodeValue;//獲取第二個子節點(文本节点) document.write("[2]元素节点值："+txt+"<pre> </pre>"); /* 整个文档是一个文档节点 每个 HTML 元素是元素节点 HTML 元素内的文本是文本节点 每个 HTML 属性是属性节点 注释是注释节点 */ </script> </body> </html>
主要还是最后那段注释··
用那些方法时！要注意调用者是谁(一般是父节点)，然后有些方法不用调用者的（如：createNode），应该分清！