是什麼是DOM
什麼是 DOM？
DOM 是?文件物件模型（Document Object Model）的簡(jiǎn)稱，它的基本想法是把結(jié)構(gòu)化文件（例如HTML 和XML）解析成一系列的節(jié)點(diǎn)，再由這些節(jié)點(diǎn)組成一個(gè)樹狀結(jié)構(gòu)（DOM Tree）。所有的節(jié)點(diǎn)和最終的樹狀結(jié)構(gòu)，都有規(guī)範(fàn)的對(duì)外接口，以達(dá)到使用程式語(yǔ)言操作文件的目的，所以，DOM 可以理解成文件（HTML 文件、XML 文件）的程式介面。
嚴(yán)格來說，DOM 不屬於 JavaScript，但是操作 DOM 是 JavaScript 最常見的任務(wù)，而 JavaScript 也是最常用於 DOM 操作的語(yǔ)言，本章介紹的就是 JavaScript 對(duì) DOM 標(biāo)準(zhǔn)的實(shí)作和用法。
什麼優(yōu)勢(shì)樹狀結(jié)構(gòu)?
<!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"> <title>HTML DOM樹型結(jié)構(gòu)圖</title> </head> <body> <div> <ul> <li>one</li> <li>two</li> <li>three</li> </ul> <div>abc</div> <p>para</p> <div>def</div> <p>para</p> <b>ghi</b> </div> </body> </html>
依據(jù)上面的HTML文檔，可以繪製一個(gè)清晰的DOM結(jié)構(gòu)樹
文件樹包含有多個(gè)層級(jí)是因?yàn)镠TML元素間的相互巢狀。其中把直接嵌入其他元素的元素被稱為那些元素的子元素（Child），例如結(jié)構(gòu)圖中的li就是ul的子元素；而隨著嵌套的繼續(xù)深入，它們也就成了後代元素（Descendant ），同樣，結(jié)構(gòu)圖中的li元素就是body元素的後代元素。那些外在元素稱為父元素（Parent）（一層之上），例如結(jié)構(gòu)圖中的ul元素就是li元素的父元素；有些外部元素稱為祖先元素（Ancestor）（兩層或以上），例如結(jié)構(gòu)圖中的body就是li元素的祖先元素。另外位於相同巢狀層級(jí)的元素稱為兄弟元素（具有同一父元素節(jié)點(diǎn)），例如結(jié)構(gòu)圖中的兩個(gè)段落P元素就是兄弟元素，因?yàn)樗鼈兙哂型粋€(gè)父元素div。在HTML文件中，一個(gè)元素可以同時(shí)擁有以上部分甚至所有稱謂，正如家譜中的某個(gè)成員一樣，總的來說這些稱謂都是用來描述一個(gè)元素與另一個(gè)元素的關(guān)係。
