HTML DOM 方法

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

HTML DOM 屬性是我們可以在節點（HTML 元素）設置和修改的值。

編程介面

可通過 JavaScript （以及其他編程語言）對 HTML DOM 進行訪問。

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

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

屬性是您能夠獲取或設置的值（比如節點的名稱或內容）。

getElementById() 方法

getElementById() 方法返回帶有指定 ID 的元素：

實例

var element=document.getElementById("intro");


HTML DOM 對象 - 方法和屬性

一些常用的 HTML DOM 方法：

  • getElementById(id) - 獲取帶有指定 id 的節點（元素）
  • appendChild(node) - 插入新的子節點（元素）
  • removeChild(node) - 刪除子節點（元素）

一些常用的 HTML DOM 屬性：

  • innerHTML - 節點（元素）的文本值
  • parentNode - 節點（元素）的父節點
  • childNodes - 節點（元素）的子節點
  • attributes - 節點（元素）的屬性節點

您將在本教學的下一章中學到更多有關屬性的知識。

現實生活中的對象

某個人是一個對象。

人的方法可能是 eat(), sleep(), work(), play() 等等。

所有人都有這些方法，但會在不同時間執行它們。

一個人的屬性包括姓名、身高、體重、年齡、性別等等。

所有人都有這些屬性，但它們的值因人而異。

一些 DOM 對象方法

這裏提供一些您將在本教程中學到的常用方法：

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