เมธอด setAttribute() ของ HTML DOM Element

การเรียกใช้และการระบุ

setAttribute() เมธอดเพิ่มคุณสมบัติที่กำหนด และกำหนดค่าที่กำหนด

ถ้าคุณสมบัติที่กำหนดนี้มีอยู่แล้ว จะตั้งค่าหรือเปลี่ยนค่าเท่านั้น

จำเป็น:โอบเจกต์ HTMLElement ในเอ็มเอลของ HTML ก็ได้กำหนดคุณสมบัติจากทั้งหมดคุณสมบัติทาง HTML มาก่อน ดังนั้น คุณจะต้องใช้เมธอดนี้เมื่อคุณต้องการตั้งค่าคุณสมบัติที่ไม่เป็นมาตรฐานเท่านั้น

ดูเพิ่มเติมที่:

คู่มืออ้างอิง:

เมธอด getAttribute()

เมธอด removeAttribute()

เมธอด hasAttribute()

เมธอด hasAttributes()

เมธอด getAttributeNode()

เมธอด setAttributeNode()

เมธอด removeAttributeNode()

คู่มือฝึกฝน:

คุณสมบัติทาง HTML

ตัวอย่าง

ตัวอย่าง 1

เพิ่มคุณสมบัติ class ให้กับองค์ประกอบ

element.setAttribute("class", "democlass");

添加之後：

Element 對象

添加之後：

Element 對象

親自試試

例子 2

將輸入字段改為按鈕：

myInput.setAttribute("type", "button");

親自試試

更改之後：

更改之後：

例子 3

向 <a> 元素添加 href 屬性：

myAnchor.setAttribute("href", "");

親自試試

添加之後：

請訪問 codew3c.com

添加之後：

請訪問 codew3c.com

例子 4

將 target 屬性的值更改为 "_self"：

if (element.hasAttribute("target")) {      
  element.setAttribute("target", "_self");
}

親自試試

語法

element.setAttribute(name, value)

參數

參數 描述
name 必需。屬性的名稱。
value 必需。新的屬性值。

返回值

無。

拋出

異常 描述
INVALID_CHARACTER_ERR 參數 name 含有 HTML 屬性名或 XML 屬性名不允許使用的字符。
NO_MODIFICATION_ALLOWED_ERR 當前元素是只讀的，不允許修改它的屬性。

注意

可以為元素添加帶有值的 style 屬性，但不建議您這樣做，因為它會覆蓋 style 屬性中的其他屬性。

請改用 Style 對象的屬性：

劣：

element.setAttribute("style", "background-color:red;");

優：

element.style.backgroundColor = "red";

瀏覽器支持

element.setAttribute() 是 DOM Level 1 (1998) 特性。

所有瀏覽器都完全支持它：

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
支持 9-11 支持 支持 支持 支持