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 = 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 = 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> |
Output:
Before Clicking on Button:
After Clicking on Button:
Supported Browsers: The browser supported by DOM Anchor rel property are listed below:
- Google Chrome
- Internet Explorer
- Firefox
- Opera
- Safari
Please Login to comment...