HTML DOM

HTML DOM

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 中,所有事物都是節點。DOM 是被視為節點樹的 HTML。

每個節點都擁有包含著關於節點某些信息的屬性。這些屬性是:

nodeName(節點名稱)nodeValue(節點值)nodeType(節點類型)

根據W3C的 HTML DOM 標準,HTML 文檔中的所有內容都是節點:

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

•每個 HTML 元素是元素節點

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

•每個 HTML 屬性是屬性節點

•注釋是注釋節點

HTML DOM 方法

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

編程接口

可通過 JavaScript (以及其他程式語言)對 HTML DOM 進行訪問。

所有 HTML 元素被定義為對象,而編程接口則是對象方法和對象屬性。

方法是您能夠執行的動作(比如添加或修改元素)。

屬性是您能夠獲取或設定的值(比如節點的名稱或內容)。

HTML DOM 對象 - 方法和屬性

一些常用的 HTML DOM 方法:

•getElementById(id) - 獲取帶有指定 id 的節點(元素)

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

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

一些常用的 HTML DOM 屬性:

•innerHTML - 節點(元素)的文本值

•parentNode - 節點(元素)的父節點

•childNodes - 節點(元素)的子節點

•attributes - 節點(元素)的屬性節點

一些 DOM 對象方法

下面列出一些常用的 DOM 對象方法:

方法描述
getElementById() 返回帶有指定 ID 的元素。
getElementsByTagName() 返回包含帶有指定標籤名稱的所有元素的節點列表(集合/節點數組)。
getElementsByClassName() 返回包含帶有指定類名的所有元素的節點列表。
appendChild() 把新的子節點添加到指定節點。
removeChild() 刪除子節點。
replaceChild() 替換子節點。
insertBefore() 在指定的子節點前面插入新的子節點。
createAttribute() 創建屬性節點。
createElement() 創建元素節點。
createTextNode() 創建文本節點。
getAttribute() 返回指定的屬性值。
setAttribute() 把指定屬性設定或修改為指定的值。

相關詞條

熱門詞條

聯絡我們