Javascript DOM HTML Element getAttributeNode() Method

Introduction

Get the value of the class attribute node of an <h1> element:

Click the button to display the value of the class attribute node of the h1 element.

View in separate window 

<!DOCTYPE html>
<html>
<head>
<style>
.democlass {/*from   w w w . j  a  va2 s  . c o m*/
  color: red;
}
</style>
</head>
<body>

<h1 class="democlass">Hello World</h1>

<button onclick="myFunction()">Test</button>

<p id="demo"></p>

<script>
function myFunction() {
  var elmnt = document.getElementsByTagName("H1")[0];
  var attr = elmnt.getAttributeNode("class").value;
  document.getElementById("demo").innerHTML = attr;
}
</script>

</body>
</html>

The getAttributeNode() method returns the attribute node by name as an Attr object.

Use the attribute.value property to get the value of the attribute node.

Use the element.getAttribute() method to get the attribute value. 

element.getAttributeNode(attributename);

Parameters

Parameter Type Description
attributename String Required. The name of the attribute to get

If the attribute does not exist, the return value is null or an empty string ("").




PreviousNext

Related