Link relAttribute
Link Object
Definition and Usage
The rel attribute specifies the relationship between the current document and the linked document.
Syntax
Set the rel attribute:
linkObject.rel="relationship"
Return the rel attribute:
linkObject.rel
Attribute values:
| Value | Description |
|---|---|
| alternate | An alternate version of the document (such as a print page, translation, or mirror). |
| stylesheet | An external stylesheet for the document. |
| start | The first document in a collection. |
| next | The next document in a collection. |
| prev | The previous document in a collection. |
| contents | A table of contents for the document. |
| index | An index for the document. |
| glossary | A glossary (explanation) of words used in the document. |
| copyright | A document containing copyright information. |
| chapter | A chapter of the document. |
| section | A section of the document. |
| subsection | A subsection of the document. |
| appendix | An appendix of the document. |
| help | A help document. |
| bookmark | A related document. |
Browser Support
All major browsers support the rel attribute
Note:Opera or Safari browsers do not support the "search" value.
Note:IE, Safari, or Chrome browsers do not support "sidebar".
Examples
Examples
Display the relationship between the current document and the linked document:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Example Tutorial(example.com)</title>
<link id="link1" rel="stylesheet" type="text/css" href="style1.css.html">
<script>
function displayResult(){
var x=document.getElementById("link1").rel;
alert(x);
}
</script>
</head>
<body>
<button type="button" onclick="displayResult()">Display the relationship between link elements</button>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>Example Tutorial(example.com)</title>
<link id="link1" rel="stylesheet" type="text/css" href="style1.css.html">
<script>
function displayResult(){
var x=document.getElementById("link1").rel;
alert(x);
}
</script>
</head>
<body>
<button type="button" onclick="displayResult()">Display the relationship between link elements</button>
</body>
</html>
Try it yourself »
Link Object Other Extensions