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

与锚标记 (<a>) 关联的 HTML DOM 目标属性指定单击 URL 后新网页将打开的位置。它可以具有以下值 -

_blank - 这将在新窗口中打开链接的文档。
_parent - 这将打开父框架集中的链接文档。
_top - 这将在全身窗口中打开链接的文档。
_self - 这将在同一窗口中打开链接的文档。这是默认行为
framename - 这将在指定的框架名中打开链接的文档。

用法

以下是语法 -

返回目标属性 -

anchorObject.target

设置目标属性 -

anchorObject.target = "_blank|_self|_parent|_top|framename"

示例

让我们看一个锚目标属性的例子 -

<!DOCTYPE html>
<html>
<body>
<p><a id="Anchor" target="_self" href="https://www.examplesite.com">example site</a></p>
<p><a id="Anchor2" href="https://www.examplesite.com">example site</a></p>
<p>Click the button to see the value of the target attribute.</p>
<button onclick="getTarget1()">GetTarget</button>
<button onclick="setTarget2()">SetTarget</button>
<p id="Target1"></p>
<script>
   function getTarget1() {
      var x = document.getElementById("Anchor").target;
      document.getElementById("Target1").innerHTML = x;
   }
   function setTarget2(){
      document.getElementById("Anchor2").innerHTML="Target has been set";
      document.getElementById("Target1").target="newframe";
   }
</script>
</body>
</html>

输出

这将产生以下输出 -

点击 “GetTarget” 按钮后 -

点击 “SetTarget” 按钮后 -

在上面的例子中 -

我们采用了一个带有 target 属性和值 _self 的锚标签，另一个带有默认 _blank 的锚标签 -

<p><a id="Anchor" target="_self" href="https://www.examplesite.com">example site</a></p>
<p><a id="Anchor2" href="https://www.examplesite.com">example site</a></p>

然后我们创建了两个名为 GetTarget 和 SetTarget 的按钮来分别执行 getTarget1() 和 setTarget2() 函数。

<button onclick="getTarget1()">GetTarget</button>
<button onclick="setTarget2()">SetTarget</button>

getTarget1() 将从第一个链接中获取目标值并显示在 id=”Target1” 的段落标记中。 setTarget2() 会将 link2 的目标值从默认 _blank 设置为自定义框架 “newframe”。

function getTarget1() {
   var x = document.getElementById("Anchor").target;
   document.getElementById("Target1").innerHTML = x;
}
function setTarget2(){
   document.getElementById("Target1").innerHTML="Target has been set";
   document.getElementById("Anchor2").target="_blank";
}

相关用法

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