Skip to content
Related Articles

Related Articles

Improve Article
Save Article
Like Article

HTML | DOM Anchor Object

  • Last Updated : 06 Feb, 2019

The Anchor Object in HTML DOM is used to represent the <a> element . The anchor element can be accessed by using getElementById() method.

Syntax:

Attention reader! Don’t stop learning now. Get hold of all the important HTML concepts with the Web Design for Beginners | HTML  course.

document.getElementById("ID"); 

Where ID is assigned to the anchor tag.

Property Values:



  • charset: It is used to set or return the character-set. It is not supported by HTML 5.
  • download: It is used to set or return the target link to download when user click.
  • hreflang: It is used set or return the language of linked document.
  • media: It is used to set or return the linked media.
  • coords: It is used to set or return the coordinate of links.
  • name: It is used to set or return the anchor name.
  • rel: It is used to set or return the relation between current document and linked document.
  • shape: It is used to set or return the shape of link.
  • type: It is used to set or return the type of links.
  • target: It is used to set or return the target link.
  • rev: It is used to set or return the relation between linked document and current document.

Example 1: This example describes the getElementById() method to access <a> element.




<!DOCTYPE html> 
<html
  
<head
    <title>
        HTML DOM Anchor Object
    </title
</head
      
<body
    <center>
        <h1>GeeksForGeeks</h1>
          
        <h2>DOM Anchor Object</h2>
          
        <p>Welcome to 
            <a href = "https://www.geeksforgeeks.org/" id="GFG"
                GeeksforGeeks 
            </a
        </p
          
        <button onclick = "myGeeks()">Submit</button>
          
        <p id = "sudo"></p>
          
        <script>
            function myGeeks() {
                var x = document.getElementById("GFG").href;
                document.getElementById("sudo").innerHTML = x;
            }
        </script>
    </center>
</body
</html>                                 

Output:
Before Click on the Button :

After Click on the Button :

Example 2: Anchor Object can be created by using the document.createElement Method.




<!DOCTYPE html> 
<html
  
<head
    <title>
        HTML DOM Anchor Object
    </title
</head
      
<body
    <center>
        <h1>GeeksForGeeks</h1>
          
        <h2>DOM Anchor Object </h2>
          
        <p id = "gfg">Welcome to </p>
          
        <button onclick = "myGeeks()">
            Submit
        </button>
          
        <!-- script to describe anchor object -->
        <script>
            function myGeeks() {
                  
                /* Create anchor tag */
                var g = document.createElement("A");
                var f = document.createTextNode("GeeksForGeeks");
                g.setAttribute("href", "https://www.geeksforgeeks.org/");
                g.appendChild(f);
                document.getElementById("gfg").appendChild(g);
            }
        </script>
    </center>
</body
  
</html>                                

Output:
Before Click on the Button :

After Click on the Button:

Supported Browsers: The browser supported by DOM Anchor Object are listed below:

  • Google Chrome
  • Firefox
  • Internet Explorer
  • Opera
  • Safari



My Personal Notes arrow_drop_up
Recommended Articles
Page :