revision:
The removeAttributeNode() method of the Element interface removes the specified attribute from the element.
The difference between removeAttribute() and removeAttributeNode() : the removeAttribute() method removes an attribute, and does not have a return value. The removeAttributeNode() method removes an Attr object, and returns the removed object. The result will be the same.
removeAttributeNode(attributeNode)
Parameters:
attributeNode : The attribute node to remove from the element.
// Given: <div id="top" align="center" />
const d = document.getElementById("top");
const d_align = d.getAttributeNode("align");
d.removeAttributeNode(d_align);
// align is now removed: <div id="top" />
Click "Remove" to remove the class attribute node from the first h4 element.
<div>
<h4 class="democlass">The Element Object</h4>
<p>Click "Remove" to remove the class attribute node from the first h4 element.</p>
<button onclick="removeFun()">Remove</button>
</div>
<style>
.democlass {color: red;}
</style>
<script>
function removeFun() {
const element = document.getElementsByTagName("H4")[0];
const attr = element.getAttributeNode("class");
element.removeAttributeNode(attr);
}
</script>
Click "Remove" to remove the href attribute node from the <a> element.
<div>
<a id="myAnchor" href="https://www.lwitters.com">A Link: Go to my website</a>
<p id="remove-1">Click "Remove" to remove the href attribute node from the <a> element.</p>
<button onclick="removeFun2()">Remove</button>
</div>
<script>
function removeFun2() {
const element = document.getElementById("myAnchor");
const attr = element.getAttributeNode("href");
element.removeAttributeNode(attr);
}
</script>
Click the button to remove the style attribute node in the header.
<div>
<h4 style="color:red">Hello World</h4>
<p id="demo">Click the button to remove the style attribute node in the header.</p>
<button onclick="removeFun3()">try it</button>
</div>
<script>
function removeFun3(){
var n=document.getElementsByTagName("H4")[1];
var a=n.getAttributeNode("style");
n.removeAttributeNode(a);
}
</script>