區別：DOM Core 與 HTML-DOM

今天在看JS DOM程式設計藝術的時候看到 DOM Core 和 HTML-DOM這2個名詞，遂上網查詢了下，幫助記錄和理解；

 

 

DOM（文件物件模型）是由W3C制定的一套訪問和操作XML（eXtensible Markup Language）文件的標準，即API。比如DOM告訴JavaScript引擎如何在瀏覽器視窗中顯示和操作XML建立的標記（Tag）。

DOM與特定的平臺、瀏覽器、語言無關，很多種語言都實現了DOM，比如因為JavaScript和PHP都實現了DOM，所以 JavaScript中有getElementsByTagName()方法，PHP中也有 getElementsByTagName()，getElementsByTagName()方法是DOM規定的訪問XML文件的介面。

XML與HTML相似，但兩者是有區別。XML和HTML都來自於SGML，它們都含有標記，有著相似的語法，HTML和XML的最大區別在 於：HTML是一個定型的標記語言，用固定的標記來描述和顯示資料，比如
<h1>表示首行標題，有固定的尺寸；而XML沒有固定的標記，只能通過自定義的標記來描述資料的形式和結構，而不能顯示。HTML是將資料 和顯示混在一起，而XML則是將資料和顯示分開來。那為什麼能使用DOM訪問和操作HTML文件（即網頁）呢？Web語義化的一個發展方向是將HTML逐 漸演變為更有語義、能將資料內容與現實分離的XML，但HTML不可能立即演變為XML，目前推薦使用的是一個過渡產物——XHTML。HTML與 XHTML網頁形成的節點樹（統稱為HTML節點樹）在結構上與XML節點樹一樣，可以看做是一個符合DOM的XML文件，因此可以使用實現了DOM的程 序語言（如JavaScript、PHP等）來訪問和操作HTML文件，即訪問和操作那些節點。

由於HTML與XML的相似性及差異，JavaScript不僅實現了標準的DOM方法和屬性（即由W3C制定的），而且還實現了HTML特有的 DOM方法和屬性，前者稱為DOM Core，並不專屬於JavaScript，後者稱為HTML-DOM。不管是DOM Core還是HTML-DOM，我們在使用JavaScript的時候要注意瀏覽器之間的相容性，因為不同的瀏覽器對這兩類方法和屬性的支援可能不一樣。 這裡不詳談DOM Core和HTML-DOM，以及跨瀏覽器相容性，教材上都有詳細描述。但一般推薦使用DOM Core方法和屬性，儘管稍顯繁雜。

常見的Core DOM方法如下：

1、建立節點
createElement()
createTextNode()
2、複製節點
cloneNode()
3、插入節點
appendChild()
insertBefore()
4、刪除節點
removeChild()
5、替換節點
replaceChild()
6、查詢和設定節點屬性
setAttribute()
getAttribute()
7、查詢節點
getElementById()
getElementsByTagName()
hasChildNode()

常見的Core DOM屬性如下：

node.childNodes
node.firstChild
node.lastChild
node.nextSibling
node.previousSibling
node.parentNode