DOM節點樹與元素樹
DOM：文檔對象類型（Document Object Mohdel）是操作XML和HTML的一類對象的集合。DOM把整個頁面映射爲一個多層節點的樹狀結構。HTML或XML頁面的每一個組成部分都是某種類型的節點，這些節點又包含着不同類型的數據。
通過DOM創建的表示文檔的樹形圖，開發人員可以獲得控制頁面內容和結構的主動權。藉助DOM提供的API，開發人員可以輕鬆的增加，刪除，替換，或修改任何節點。
DOM的節點類型
- 元素節點：HTML元素在DOM中的形式
- 文本節點：HTML中未被元素包裹的文本（空格，回車也算）
- 註釋節點：HTML中的註釋雖然不參與執行，但在DOM中會呈現爲註釋節點
- 屬性節點：HTML元素的屬性在DOM中以屬性節點的形式來表示。
節點的四個屬性
- nodeName：該屬性爲節點的標籤名 只讀
- nodeValue：文本或註釋節點的內容（文本節點註釋節點專有） 可讀寫
- nodeType： 該屬性爲節點的類型，不同節點有不同的返回值
|節點類型|返回值 |
|-------------|----|
| 元素節點 | 1 |
| 屬性節點 | 2 |
| 文本節點 | 3 |
| 註釋節點 | 8 |
| document | 9 | - attributes：元素節點的屬性集合（元素節點專有）可讀，屬性值可寫，屬性名不可寫
遍歷節點樹
節點樹的根節點爲document
節點樹查詢操作
- parentNode -> 父節點
- childNodes -> 子節點們
- firstChild -> 第一個子節點
- lastChild -> 最後一個子節點
- nextSibling -> 後一個兄弟節點
- previousSibling -> 前一個兄弟節點
遍歷元素樹
元素樹的根節點爲
<html>元素
元素樹查詢操作
- parentElement-> 父元素節點
- children -> 子元素節點
- firstElementChild -> 第一個元素子節點
- lastElementChild -> 最後一個元素子節點
- nextElementSibling -> 後一個兄弟元素節點
- previousElementSibling -> 前一個兄弟元素節點