HTML DOM Anchor rel Property

HTMLWeb DevelopmentFront End Technology

The HTML DOM Anchor Rel property returns the rel attribute of a link. The rel attribute describes the association between the running document and the linked document.

Syntax

Following is the syntax to −

  • a) Return the rel property −

anchorObject.rel
  • b) Set the rel property &minus

anchorObject.rel = "value"

Example

Let us see an example of the HTML DOM anchor rel property −

<!DOCTYPE html>
<html>
<body>
<h1>Example</h1>
<p><a id="anchorExample" rel="Rel Property" href="https://www.examplesite.com/">
Anchor Rel Property</a></p>
<p>Click on the button</p>
<button onclick="display()">Click me!</button>
<p id="show"></p>
<script>
   function display() {
      var docs = document.getElementById("anchorExample").rel;
      document.getElementById("show").innerHTML = docs;
   }
</script>
</body>
</html>

Output

This will produce the following output −

Click on the “Click me!” button to get the HTML DOM Anchor rel property −

In the above example −

We have taken an anchor tag with rel property used for specifying the type of relation to the linked document which in the above code is https://www.examplesite.com/

<p>
<a id="anchorExample" rel="Rel Property" href="https://www.examplesite.com/">Anchor Rel Property</a>
</p>

We have then created a button named “Click Me” to execute the display function −

<button onclick="display()">Click me!</button>

The display function gets the rel property of the element with id=” Anchor example” −

function display() {
   var docs = document.getElementById("anchorExample").rel;
   document.getElementById("show").innerHTML = docs;
}

We have then created a button named “Click Me” to execute the display function −

raja
Published on 06-Aug-2019 15:32:43
Advertisements