HTML DOM Anchor rel属性用法及代码示例

HTML DOM Anchor Rel 属性返回链接的 rel 属性。 rel 属性描述了运行文档和链接文档之间的关联。

用法

以下是语法 -

a) 返回 rel 属性 -

anchorObject.rel

b) 设置 rel 属性

anchorObject.rel = "value"

示例

让我们看一个 HTML DOM 锚点 rel 属性的例子 -

<!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>

输出

这将产生以下输出 -

点击“点击我！”按钮获取 HTML DOM Anchor rel 属性 -

在上面的例子中 -

我们采用了一个带有 rel 属性的锚标记，用于指定与链接文档的关系类型，在上面的代码中是 https://www.examplesite.com/

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

然后我们创建了一个名为 “Click Me” 的按钮来执行显示函数 -

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

display 函数获取元素的 rel 属性，id=”Anchor example” -

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

然后我们创建了一个名为 “Click Me” 的按钮来执行显示函数 -

相关用法

注：本文由纯净天空筛选整理自AmitDiwan大神的英文原创作品 HTML DOM Anchor rel Property。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。