How to remove all attributes of an HTML element using jQuery ?
In this article, we will see how to remove all attributes of an HTML element using jQuery. To remove all attributes of elements, we use the removeAttributeNode() method and .removeAllAttributes().
Syntax:
$.fn.removeAllAttributes = function() {
return this.each(function() {
$.each(this.attributes, function() {
this.ownerElement.removeAttributeNode(this);
});
});
};
$('textarea').removeAllAttributes();
In the below example, we are creating a textarea element containing some attributes like – rows, cols, id, and name. When we apply the above code to a textarea element, all attributes will be removed.
Example: In this example, we will remove textarea from all attributes using the above method.
HTML
<!DOCTYPE html><html><head> <title> How to remove all attributes of an HTML element using jQuery? </title> <script src= </script> <style> #txtarea { font-size: 18px; background-color: green; } </style> <script> $(document).ready(function() { $("#position").on('click', function() { $.fn.removeAllAttributes = function() { return this.each(function() { $.each(this.attributes, function() { this.ownerElement.removeAttributeNode(this); }); }); }; $('textarea').removeAllAttributes(); }); }); </script></head><body> <center> <h1 style="color: green;"> GeeksforGeeks </h1> <h3> How to remove all attributes of an HTML element using jQuery? </h3> <input type="button" id="position" value="Remove All Attributes" style="padding: 5px 10px;"> <br><br> <textarea rows="7" cols="35" id="txtarea" name="comment">Welcome to GeeksforGeeks </textarea> </center></body></html> |
Output:
Please Login to comment...