HTML DOM中文參考手冊

在《HTML DOM中文參考手冊》中，HTML DOM 定義了存取和操作 HTML 文件的標準方法。 DOM 以樹狀結構表達 HTML 文件。

HTML DOM是HTML Document Object Model(文檔物件模型)的縮寫，HTML DOM則是專門適用於HTML/XHTML的文檔物件模型。熟悉軟體開發的人員可以將HTML DOM理解為網頁的API。它將網頁中的各個元素都看作一個個對象，從而使網頁中的元素也可以被電腦語言取得或編輯。例如Javascript就可以利用HTML DOM動態地修改網頁。

DOM是Document Object Model文檔物件模型的縮寫。根據W3C DOM規範，DOM是一種與瀏覽器，平台，語言無關的接口，使得你可以訪問頁面中其他的標準組件。簡單理解，DOM解決了Netscape的JavaScript和 Microsoft的JavaScript之間的衝突，給予web設計師和開發者一個標準的方法，讓他們來存取他們網站中的資料、腳本和表現層物件。

DOM是以層次結構組織的節點或資訊片段的集合。這個層次結構允許開發人員在樹中導航尋找特定資訊。分析該結構通常需要載入整個文件和建構層次結構，然後才能做任何工作。由於它是基於資訊層次的，因而 DOM 被認為是基於樹或基於物件的。

HTML DOM 定義了存取和操作HTML文件的標準方法。

HTML DOM 把 HTML 文件呈現為帶有元素、屬性和文字的樹狀結構（節點樹）。

提示：在您繼續學習HTML DOM之前，您需要先對HTML、CSS、JavaScrip內容擁有基本的了解。

節點資訊

在 HTML DOM 中，所有事物都是節點。 DOM 是被視為節點樹的 HTML。

每個節點都擁有包含關於節點某些資訊的屬性。這些屬性是：

nodeName（節點名稱）nodeValue（節點值）nodeType（節點類型）

根據W3C的HTML DOM 標準，HTML 文件中的所有內容都是節點： 

• 整個文件是一個文件節點

• 每個HTML 元素是元素節點

• HTML 元素內的文字是文字節點

• 每個HTML 屬性是屬性節點

• 註解是註解節點

提示：我們的HTML DOM 教學將幫助您逐步學習HTML DOM，如果你有任何疑問，請前往PHP中文網HTML DOM社群提出你的問題，會有熱心網友為你解答。

HTML DOM 方法

方法是我們可以在節點（HTML 元素）上執行的動作。 

• 程式介面

可透過 JavaScript （以及其他程式語言）對 HTML DOM 進行存取。

所有 HTML 元素被定義為對象，而程式設計介面則是對象方法和對象屬性。

方法是您能夠執行的動作（例如新增或修改元素）。

屬性是您能夠取得或設定的值（例如節點的名稱或內容）。

• HTML DOM 物件- 方法與屬性

#一些常用的HTML DOM 方法：

• getElementById(id) - 取得指定id 的節點（元素）

• appendChild(node) - 插入新的子節點（元素）

• #removeChild(node) - 刪除子節點（元素）

一些常用的HTML DOM 屬性：

• innerHTML - 節點（元素）的文字值

• parentNode - 節點（元素）的父節點

• childNodes - 節點（元素）的子節點

• #attributes - 節點（元素）的屬性節點

#本HTML DOM教學手冊涵蓋的內容

本HTML DOM教學手冊涵蓋所有HTML DOM基礎知識，包含DOM節點、DOM方法、DOM屬性、DOM存取、DOM元素、DOM事件等等知識。

提示：本教學的每一章都包含了許多HTML DOM實例，您可以直接點擊 "執行實例" 按鈕線上查看結果。這些範例將幫助您更好地理解學習HTML DOM。

其它HTML DOM相關學習參考資源

除了本頁右側的知識拓展，也為大家精選了以下資源

• PHP中文網獨孤九賤系列HTML5影片教學

• #HTML每日程式設計小知識

• #前端學習路線：如何成為優秀的前端開發人員！