HTML DOM 方法

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

程式設計介面

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

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

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

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

getElementById() 方法

getElementById() 方法傳回指定ID 的元素：

實例

<html><!DOCTYPE html>
<html>
<body>

<p id="intro">Hello World!</p>
<p>This example demonstrates the <b>getElementById</b> method!</p>

<script>
x=document.getElementById("intro");
document.write("<p>The text from the intro paragraph: " + x.innerHTML + "</p>");
</script>

</body>
</html>

運行實例»

點擊"運行實例" 按鈕查看線上實例

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()	把指定屬性設定或修改為指定的值。