Javascript 基礎(chǔ)教程之認(rèn)識DOM
什么是DOM ？
文檔對象模型DOM ?英文縮寫：Document Object Model，定義訪問和處理HTML文檔的標(biāo)準(zhǔn)方法。DOM 將HTML文檔呈現(xiàn)為帶有元素、屬性和文本的樹結(jié)構(gòu)（節(jié)點樹）
這個說法很官方，大家肯定還是不明白。
舉個例子：我們有一段HTML，那么如何訪問第二層第一個節(jié)點呢，如何把最后一個節(jié)點移動到第一個節(jié)點上面去呢？
DOM就是定義了如果做類似操作，那么應(yīng)該怎么做的標(biāo)準(zhǔn)。比如用getElementById來訪問節(jié)點，用insertBefore來插入節(jié)點。
當(dāng)瀏覽器載入HTML時，會生成相應(yīng)的DOM樹。
簡而言之，DOM可以理解為一個訪問或操作HTML各種標(biāo)簽的實現(xiàn)標(biāo)準(zhǔn)。
對于一個HTML來說，文檔節(jié)點Document（看不到的）是它的根節(jié)點，對應(yīng)的對象便是document對象（嚴(yán)格講是子類HTMLDocument對象，下面單獨(dú)介紹Document類型時會指出）。
換句話說存在一個文檔節(jié)點Document，然后它有子節(jié)點，比如通過document.getElementsByTagName(“html”)，得到類型為元素節(jié)點的Element html。
每一段HTML標(biāo)記都可以用相應(yīng)的節(jié)點表示，例如：
HTML元素通過元素節(jié)點表示，注釋通過注釋節(jié)點表示，文檔類型通過文檔類型節(jié)點表示等。
一共定義了12種節(jié)點類型，而這些類型又都繼承自Node類型。
所以我們首先講Node類型，因為這個類型的方法是所有節(jié)點都會繼承的。
?
如下代碼：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>DOM</title> </head> <body> <h2><a href="ipnx.cn">Javascript DOM</a></h2> <p>對html元素進(jìn)行操作，可添加，改變或移除css樣式等</p> <ul> <li>Javascript</li> <li>DOM</li> <li>css</li> </ul> </body> </html>
將HTML代碼分解為DOM節(jié)點層次圖:
HTML文檔可以說由節(jié)點構(gòu)成的集合，DOM節(jié)點有:
1. 元素節(jié)點：上圖中<html>、<body>、<p>等都是元素節(jié)點，即標(biāo)簽。
2. 文本節(jié)點:向用戶展示的內(nèi)容，如<li>...</li>中的JavaScript、DOM、CSS等文本。
3. 屬性節(jié)點:元素屬性，如<a>標(biāo)簽的鏈接屬性href="http://ipnx.cn"。
例如上面代碼中的a標(biāo)簽
a 標(biāo)簽-------元素節(jié)點
href="ipnx.cn"--------屬性節(jié)點
javascript ?DOM ---------- 文本節(jié)點
