You are here: Reference > JavaScript > client-side > HTML DOM > methods > setAttributeNode

setAttributeNode method

Browser support:
Adds the specified attribute node to the current element.
If an attribute with the same name exists on the current element, then this method removes it and returns the removed attribute node.
The name is case-sensitive in XML documents and case-insensitive in HTML documents.
If you want to set a value for an HTML attribute, use the name of the HTML attribute instead of the corresponding JavaScript property name in Internet Explorer (unlike in the case of the setAttribute method)!
To set a value of an attribute, you do not need to work with attribute nodes; the use of the setAttribute method is simpler.

Syntax:

object.setAttributeNode (attributeNode);
You can find the related objects in the Supported by objects section below.

Parameters:

attributeNode
Required. Reference to an attribute node to add.

Return value:

Returns the removed attribute node or null if no attribute was removed.

Methods for attributes without namespaces:

Name Browser Description
createAttribute
Creates a new attribute node with the specified name.
getAttribute
Returns the value of the attribute with the specified name from the current element.
getAttributeNode
Returns the attribute node with the specified name from the current element.
getNamedItem
Returns the attribute node with the specified name from the current attributes collection.
hasAttribute
8
Returns whether the current element has an attribute with the specified name or not.
removeAttribute
Removes the attribute with the specified name from the current element.
removeAttributeNode
Removes the specified attribute node from the current element.
removeNamedItem
Removes the attribute with the specified name from the current attributes collection and returns the removed attribute node.
setAttribute
Adds an attribute with the specified name and value to the current element.
setAttributeNode
Adds the specified attribute node to the current element.
setNamedItem
Adds the specified attribute node to the current attributes collection.

Example HTML code 1:

This example illustrates the use of the setAttributeNode method:
<head>
    <style>
        .sample {color:red;}
    </style>
    <script type="text/javascript">
        function SetClass () {
            var div = document.getElementById ("myDiv");
            var attr = document.createAttribute ("class");
            attr.value = "sample";
            div.setAttributeNode (attr);
        }
    </script>
</head>
<body>
    <div id="myDiv">
        Some text inside the division element.
    </div>
    <br />
    <button onclick="SetClass ()">Set a style class for the division element!</button>
</body>
Did you find this example helpful? yes no

Supported by objects:

Related pages:

External links:

User Contributed Comments

Post Content

Post Content