HTML | DOM Anchor rel Property

The Anchor rel Property in HTML DOM is used to set or return the value of rel attribute of a link. The rel attribute is used to specify the relation between the current document and the linked document.
Syntax:

It returns the Anchor rel property.

anchorObject.rel

It is used to set the Anchor rel property.

anchorObject.rel = "value"

Property Values:

alternate: It defines an alternate version of the document i.e. print page, translated or mirror.
author: It defines the author of the document.
bookmark: It specify a related document.
help: It specifies a help document.
license: It defines a copyright information for the document.
next: It defines the next document in a selection.
nofollow: It is used by Google, to specify that the Google search spider should not follow that link and mostly used for paid links.
noreferrer: It is used to Specify that the browser should not send a HTTP referrer header if the user follows the hyperlink.
prefetch: It specifies that the target document should be cached.
prev: It specify the previous document in a selection.
search: It specify the search tool for the document.
tag:It specifies a tag keyword for the current document.

Return Value: It returns a string value which represents the relation between the current document and the linked document.
Example 1: This example returns the Anchor rel Property.

html

<!DOCTYPE html>
<html>
 
<head>
    <title>
        HTML DOM Anchor rel Property
    </title>
</head>
     
<body>
    <center>
        <h1>GeeksForGeeks</h1>
         
        <h2>DOM Anchor rel Property</h2>
         
         
<p>Welcome to
            <a href =
"https://write.geeksforgeeks.org/wp-admin/post.php?post=964437&action=edit"
            id="GFG" rel="nofollow" target= "_self">
                GeeksforGeeks
            </a>
        </p>
  
         
        <button onclick = "myGeeks()">Submit</button>
         
        <p id = "sudo" style="color:green;font-size:25px;"></p>
  
         
        <!-- Script to return Anchor rel Property -->
        <script>
            function myGeeks() {
                var x = document.getElementById("GFG").rel;
                document.getElementById("sudo").innerHTML = x;
            }
        </script>
    </center>
</body>
 
</html>   

Output:
Before Clicking on Button:

After Clicking on Button:

Example 2: This example sets the Anchor rel Property.

html

<!DOCTYPE html>
<html>
 
<head>
    <title>
        HTML DOM Anchor rel Property
    </title>
</head>
     
<body>
    <center>
        <h1>GeeksForGeeks</h1>
         
        <h2>DOM Anchor rel Property</h2>
         
         
<p>Welcome to
            <a href =
"https://write.geeksforgeeks.org/wp-admin/post.php?post=964437&action=edit"
            id="GFG" rel="nofollow" target= "_self">
                GeeksforGeeks
            </a>
        </p>
  
         
        <button onclick = "myGeeks()">Submit</button>
         
        <p id = "sudo" style="color:green;font-size:25px;"></p>
  
         
        <!-- Script to set Anchor rel Property -->
        <script>
            function myGeeks() {
                var x = document.getElementById("GFG").rel
                        = "prefetch";
                         
                document.getElementById("sudo").innerHTML
                        = "The value of the rel attribute "
                        + "was changed to " + x;
            }
        </script>
    </center>
</body>
 
</html>   