Link rel 属性
JavaScript基础 2022-06-08 16:53:26小码哥的IT人生shichen
Link rel 属性
定义和用法
rel 属性设置或返回以空格分隔的列表，该列表定义了当前文档和被链接文档之间的关系。
另请参阅：
HTML 参考手册：HTML <link> rel 属性
HTML 参考手册：HTML <link> 标签
实例
返回当前文档和被链接文档的关系：
var x = document.getElementById("myLink").rel;
完整实例：
<!DOCTYPE html>
<html>
<head>
<link id="myLink" rel="stylesheet" type="text/css" href="/demo/htmldom/style.css">
</head>
<body>
<h1>我使用链接的样式表进行格式化</h1>
<p>单击该按钮可返回当前文档和链接文档之间的关系。</p>
<button onclick="myFunction()">试一试</button>
<p id="demo"></p>
<script>
function myFunction() {
var x = document.getElementById("myLink").rel;
document.getElementById("demo").innerHTML = x;
}
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
语法
返回 rel 属性：
linkObject.rel
设置 rel 属性：
linkObject.rel = relationship
属性值
| 值 | 描述 |
|---|---|
| alternate | 链接页面是当前文档的替代版本。 |
| appendix | 链接页是当前文档的附录页。 |
| chapter | 引用一章。 |
| contents | 链接页面是当前文档的目录。 |
| copyright | 链接页面是当前文档的版权/政策。 |
| glossary | 链接页面是当前文档的词汇表页面。 |
| help | 链接页面是当前文档的帮助页面。 |
| icon | 引用图标位置。 |
| index | 链接页是当前文档的索引页。 |
| next | 引用下一页。 |
| offline | 引用包含 CDF 文件路径的位置。 |
| prev | 引用上一页。 |
| search | 引用 OpenSearch 描述格式的 XML 文件。 |
| section | 链接到文档列表中的某个部分。 |
| sidebar | 引用书签面板。 |
| start | 引用首页（搜索引擎用来显示首页）。 |
| stylesheet | 链接页面是当前文档的样式表。 |
| subsection | 链接页面是当前文档的一个小节。 |
技术细节
| 返回值： | 字符串值，表示以空格分隔的关系类型列表。 |
|---|
浏览器支持
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 支持 | 支持 | 支持 | 支持 | 支持 |
