JavaScript removeAttributeNode() method
JavaScript's removeAttributeNode() method can be used as an alternate
to the removeAttribute() method. It is used to remove attributes when you
have a reference to the attribute object. Following is the syntax of using
method removeAttributeNode() :
Syntax:
| element_object.removeAttributeNode(
attribute_reference ); |
Where attribute_reference is the reference to the attribute which is
to be removed. But the point to be noticed is that this attribute is working for
Internet Explorer 6 and higher versions only.
Description of code:
To illustrate the use of removeAttributeNode() method we have created
a simple HTML page into which we have created a Text Box into which we
have set the "readonly" attribute to be "true".
After that we have created a button named "Remove Attribute Node(
Read Only )" which calls the function removeAttributeNodeReadOnly()
when clicked.
function removeAttributeNodeReadOnly(){
var attribute = document.getElementById("txt")
.getAttributeNode("readonly",0);
document.getElementById("txt")
.removeAttributeNode(attribute);
alert("Removed Attribute Node");
}
|
In above lines of code we first take the reference to the attribute into a
variable "attribute" using the method
getAttributeNode(). Once we have reference to the attribute we can apply
the method removeAttributeNode(attribute)
| document.getElementById("txt").removeAttributeNode(attribute); |
Here is the full example code as follows :
<html>
<body>
<script language="JavaScript">
function removeAttributeNodeReadOnly(){
var attribute = document.getElementById("txt")
.getAttributeNode("readonly",0);
document.getElementById("txt").removeAttributeNode(attribute);
alert("Removed Attribute Node");
}
</script>
<div style="background: #ff9900; width:'100%';"
align="center">
<font color="#0000ff" size="12pt">
<b>Remove Attribute Node Example</b>
</font>
</div>
<center>
<div style="background: #0099ff; width:'100%';"
align="center">
<input type="text" id="txt" readonly="true" />
</div>
<input type="button" value="Remove Attribute
Node(Read Only)" onclick="removeAttributeNodeReadOnly();">
</center>
</body>
</html>
|
Output :
When you tries to enter some text into the text field it doesn't allow to
do so since its "readonly" property is true. Now click on the button "Remove
Attribute Node( Read Only)". It will remove the attribute node by
taking the reference to that element.
Now you can see that text box's read only attribute is removed. You
can insert some text into text box.
You
can also download full source code of the above given HTML file as follows:
Download Source Code
|
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
