什么是DOM?
DOM 是 Document Object Model（文檔對象模型）的縮寫。DOM是一套對文檔的內(nèi)容進(jìn)行抽象和概念化的方法。通過JavaScript扔枫，可以重構(gòu)整個HTML文檔。您可以添加锹安、移除短荐、改變或重排頁面上的項目。要改變頁面的某個東西叹哭，JavaScript就需要對HTML文檔中所有元素進(jìn)行訪問忍宋。
W3C DOM 標(biāo)準(zhǔn)被分為 3 個不同的部分：
- 核心 DOM - 針對任何結(jié)構(gòu)化文檔的標(biāo)準(zhǔn)模型
- XML DOM - 針對 XML 文檔的標(biāo)準(zhǔn)模型
- HTML DOM - 針對 HTML 文檔的標(biāo)準(zhǔn)模型
重點(diǎn)學(xué)習(xí) HTML DOM
HTML DOM 是：
* HTML 的標(biāo)準(zhǔn)對象模型
* HTML 的標(biāo)準(zhǔn)編程接口
* W3C 標(biāo)準(zhǔn)
HTML DOM 定義了所有 HTML 元素的對象和屬性，以及訪問它們的方法话速。
換言之讶踪，HTML DOM 是關(guān)于如何獲取、修改泊交、添加或刪除 HTML 元素的標(biāo)準(zhǔn)乳讥。
節(jié)點(diǎn)樹
在數(shù)據(jù)結(jié)構(gòu)中我們也使用過樹，在這里我們?nèi)匀皇褂脴淅螅覀儗⑺械墓?jié)點(diǎn)形象化的展示出來云石，所有的節(jié)點(diǎn)均可通過 JavaScript 進(jìn)行訪問。
源碼
<html>
<head>
<title>DOM 教程</title>
</head>
<body>
<a href = "#"> welcome to my blog</a>
<h1>DOM 第一課</h1>
</body>
</html>
從上面的 HTML 分析得出：
<html> 節(jié)點(diǎn)沒有父節(jié)點(diǎn)研乒；它是根節(jié)點(diǎn),有且只有一個
<head> 和 <body> 的父節(jié)點(diǎn)<html> 節(jié)點(diǎn)
文本節(jié)點(diǎn) "welcome to my blog" 的父節(jié)點(diǎn)是 <a>節(jié)點(diǎn)
并且：
* <html> 節(jié)點(diǎn)擁有兩個子節(jié)點(diǎn)：<head> 和 <body>
* <head> 節(jié)點(diǎn)擁有一個子節(jié)點(diǎn)：<title> 節(jié)點(diǎn)
* <title> 節(jié)點(diǎn)也擁有一個子節(jié)點(diǎn)：文本節(jié)點(diǎn) "DOM 教程"
* <h1> 和 <a> 節(jié)點(diǎn)是同胞節(jié)點(diǎn),也就是兄弟節(jié)點(diǎn)汹忠，同時也是 <body> 的子節(jié)點(diǎn)
并且：
* <head> 元素是 <html> 元素的首個子節(jié)點(diǎn)
* <body> 元素是 <html> 元素的最后一個子節(jié)點(diǎn)
* <a> 元素是 <body> 元素的首個子節(jié)點(diǎn)
* <h1> 元素是 <body> 元素的最后一個子節(jié)點(diǎn)
總結(jié)
通過節(jié)點(diǎn)樹，我們能快速的將節(jié)點(diǎn)樹翻譯成我們的源碼，同樣宽菜，我們也可以通過源碼構(gòu)造一棵節(jié)點(diǎn)樹谣膳，我們易可以進(jìn)行對節(jié)點(diǎn)樹信息修改，在任意位置增加我們想要的信息铅乡。
想要了解怎樣對節(jié)點(diǎn)進(jìn)行增刪改善的遍歷继谚，敬請期待下一篇文章。
