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: