HTML DOM getAttribute() Method

Last Updated : 26 Sep, 2024

The HTML DOM getAttribute() method is used to retrieve the value of a specified attribute from an HTML element. It returns the attribute’s value as a string or null if the attribute doesn’t exist.

Note: It will return a null or an empty string if the specified attribute doesn’t exist.

Syntax

Object.getAttribute(attributename)

Parameter

Parameter	Description
name	It is a required parameter with a string type that specifies the name of the attribute that needs to retrieve the value.

Example 1: This example illustrates the DOM getAttribute() method that specifies the value of the attribute for the specified name, of an element.

HTML

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" 
          content="width=device-width, initial-scale=1.0">
    <title>HTML DOM getAttribute() Method</title>
</head>

<body>
    <h1 style="color:green;width:50%;">
        GeeksforGeeks
    </h1>
    <h2>DOM getAttribute() Method</h2>
    <br>
    <button id="button" 
            onclick="geeks()">Submit</button>
    <p id="gfg"></p>
    <script>
        function geeks() {
            let rk =
document.getElementById("button").getAttribute("onClick");
document.getElementById("gfg").innerHTML = rk;
        }
    </script>
</body>

</html>

Output:

DOM getAttribute() Method

Example 2: This example illustrates the DOM getAttribute() method to retrieve the href attribute value of an element.

HTML

<!DOCTYPE html>
<html>

<body>
    <h1 style="color:green;width:50%;">
        GeeksforGeeks
    </h1>
    <h2>DOM getAttribute() Method</h2>
    <a id="gfg" href="www.geeksforgeeks.com">
        GeeksforGeeks
    </a><br><br>
    <button id="button" 
            onclick="geeks()">Submit</button>
    <br>
    <p id="rk"></p>
    <script>
        function geeks() {
            var rk = document.getElementById("gfg").getAttribute("href");
            document.getElementById("rk").innerHTML = rk;
        }
    </script>
</body>

</html>

Output:

DOM getAttribute() Method

We have a complete list of HTML DOM methods, to check those please go through this HTML DOM Object Complete reference article.

Supported Browsers:

Google Chrome 1.0
Microsoft Edge 12.0
Firefox 1.0
Opera 8.0
Safari 1.0

We have a Cheat Sheet on Javascript where we covered all the important topics of Javascript to check those please go through Javascript Cheat Sheet-A Basic guide to JavaScript.