HTML DOM id Property
The DOM id Property is used to set or return the id of an element i.e value of the Id Attribute. An ID should be different in a document. It is returned by using the document.getElementById() method.
Syntax
HTMLElementObject.id
Return values: This syntax is used to return the id Property.
HTMLElementObject.id = id
Property: It contains the value of the ID attribute and used to return the ID attribute.
Example-1: Get the ID of the first element.
html
<!DOCTYPE html><html> <head> <title> HTML | DOM id Property </title> <style> .GEEKS { display: block; padding: 5px; background-color: green; color: white; } #GFG { background-color: tomato; } </style></head> <body> <h1 style="color:green; font-weight:bold; text-align:center;"> GeeksForGeeks </h1> <h2 style="color:green; font-weight:bold; text-align:center"> DOM ID Property </h2> <a class="GEEKS" id="GFG" href="#"> C programming </a> <a class="GEEKS" href=" # "> java </a> <a class="GEEKS " href="# "> Ruby </a> <button onclick="GEEKS() "> Submit </button> <p id="SUDO "></p> <script> function GEEKS() { var x = document .getElementsByClassName("GEEKS ")[0].id; document.getElementById("SUDO ").innerHTML = x; } </script></body> </html> |
Output:
Example 2: Change the value at a particular ID.
html
<!DOCTYPE html><html> <head> <title> HTML | DOM id Property </title> </head> <body style="text-align: center;"> <h1 style="color:green; font-weight:bold; text-align:center;"> GeeksForGeeks </h1> <h2 style="color:green; font-weight:bold; text-align:center"> DOM ID Property </h2> <p> <a id="geeks" href="#"> GeeksforGeeks </a> </p> <button onclick="geeks()">Submit</button> <p id="gfg"></p> <script> function geeks() { document.getElementById("geeks").id = "sudo"; document.getElementById("gfg").innerHTML = "The value of the ID attribute" + "changed from geeks to sudo"; } </script></body> </html> |
Output:
Supported Browsers: The browser supported by DOM ID property are listed below:
- Google Chrome 23
- Edge 12
- Internet Explorer 5
- Firefox 1
- Opera 12.1
- Safari 1
Please Login to comment...