Web/API/Element/setAttributeNode

From Get docs


The setAttributeNode() method adds a new Attr node to the specified element.

Syntax

var replacedAttr = element.setAttributeNode(attribute);
  • attribute is the Attr node to set on the element.
  • replacedAttr is the replaced attribute node, if any, returned by this function.

Example

This example copies the align attribute from one element to another.

HTML

<div id="one" align="left">one</div>
<div id="two">two</div>

JavaScript

let d1 = document.getElementById('one');
let d2 = document.getElementById('two');
let a = d1.getAttributeNode('align');

d2.setAttributeNode(a.cloneNode(true));

// Returns: 'left'
alert(d2.attributes[1].value);

Notes

If the attribute named already exists on the element, that attribute is replaced with the new one and the replaced one is returned.

This method is seldom used, with Element.setAttribute() usually being used to change element's attributes.

DOM methods dealing with element's attributes:

Not namespace-aware, most commonly used methods Namespace-aware variants (DOM Level 2) DOM Level 1 methods for dealing with Attr nodes directly (seldom used) DOM Level 2 namespace-aware methods for dealing with Attr nodes directly (seldom used)
setAttribute (DOM 1) setAttributeNS setAttributeNode setAttributeNodeNS
getAttribute (DOM 1) getAttributeNS getAttributeNode getAttributeNodeNS
hasAttribute (DOM 2) hasAttributeNS - -
removeAttribute (DOM 1) removeAttributeNS removeAttributeNode -

Specifications

Specification Status Comment
DOMThe definition of 'setAttributeNode()' in that specification. Living Standard

Browser compatibility

Update compatibility data on GitHub

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet
setAttributeNode Chrome

Full support Yes

Edge

Full support 12

Firefox

Full support Yes

IE

Full support Yes

Opera

Full support Yes

Safari

Full support 6

WebView Android

Full support Yes

Chrome Android

Full support Yes

Firefox Android

Full support Yes

Opera Android

Full support Yes

Safari iOS

Full support Yes

Samsung Internet Android

Full support Yes

Legend

Full support  
Full support