HTML DOM Element setAttributeNode() 方法

定義和用法

setAttributeNode() 方法向元素中添加指定的屬性節點，并返回 Attribute 對象。

如果這個指定的屬性已存在，則此方法會替換它。

替代方案：

使用 setAttribute() 方法 更容易。

另請參閱：

參考手冊：

getAttributeNode() 方法

removeAttributeNode() 方法

createAttribute() 方法

getAttribute() 方法

setAttribute() 方法

hasAttribute() 方法

Attribute value 屬性

HTML DOM Attribute 對象

教程：

HTML 屬性

setAttribute() 和 setAttributeNode() 的區別

setAttribute() 方法替換屬性值。

setAttributeNode() 方法替換 Attribute 對象。

在將屬性添加到元素之前，您必須創建 Attr 對象并設置 Attr 值。

結果將是相同的。

實例

例子 1

設置第一個 <h1> 元素的 class 屬性節點：

const attr = document.createAttribute("class");
attr.value = "democlass";
const h1 = document.getElementsByTagName("H1")[0];
h1.setAttributeNode(attr);

親自試一試

設置之前：

Hello World

設置之后：

Hello World

例子 2

設置 <a> 元素的 href 屬性節點：

const attr = document.createAttribute("href");
attr.value = "";
const anchor = document.getElementById("myAnchor");
anchor.setAttributeNode(attr);

親自試一試

設置之前：

請訪問 codew3c.com

設置之后：

請訪問 codew3c.com

語法

element.setAttributeNode(newAttr)

參數

參數 描述
newAttr 必需。表示要添加的屬性，或其值需要修改的屬性的 Attr 節點。

返回值

類型 描述
對象

表示被替換屬性節點的 Attr 對象。

如果沒有屬性被替換，則為 null。

拋出

該方法將拋出含有以下代碼的 DOMException 異常：

異常 描述
INUSE_ATTRIBUTE_ERR newAttr 已經是其他 Element 節點的屬性集合的成員。
NO_MODIFICATION_ALLOWED_ERR 當前的 Element 節點是只讀的，不允許修改它的屬性。
WRONG_DOCUMENT_ERR newAttr 的 ownerDocument 屬性不同于要設置它的 Element 節點。

瀏覽器支持

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

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

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