当前位置: 首页>>代码示例 >>用法及示例精选 >>正文


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


HTML DOM Base 目标属性与 HTML <base> 元素相关联。它用于设置或返回 <base> 元素的目标属性的值。 target 属性用于指定超链接将打开的位置。它可以在页面本身或新页面中打开。

特性

以下是目标属性的值 -

属性值描述
_blank在新窗口中打开链接。
_self在单击它的同一框架中打开链接。它是默认行为。
_parent在父框架集中打开链接。
_top在整个窗口中打开链接。
framename在指定的框架名称中打开链接。

用法

以下是语法 -

返回目标属性 -

baseObject.target

设置目标属性 -

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

示例

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

<!DOCTYPE html>
<html>
<head>
<base id="Base" target="newframe1" href="https://www.example.com">
</head>
<body>
<p>Click the below button to get the target attribute value</p>
<button onclick="getTarget()">GET TARGET</button>
<p>Click the below button to set the target attribute value</p>
<button onclick="setTarget()">SET TARGET</button>
<p id="Sample"></p>
<script>
   function getTarget() {
      var x = document.getElementById("Base").target;
      document.getElementById("Sample").innerHTML = "Base target for all links is:" + x;
   }
   function setTarget(){
      document.getElementById("Base").target="_blank"
      document.getElementById("Sample").innerHTML="Target has been changed from
      newframe1 to _blank"
   }
</script>
</body>
</html>

输出

这将产生以下输出 -

点击获取目标 -

单击设置目标 -

在上面的例子中 -

我们首先创建了两个按钮 GET TARGET 和 SET TARGET 来分别执行函数 getTarget() 和 setTarget() -

<button onclick="getTarget()">GET TARGET</button>
<button onclick="setTarget()">SET TARGET</button>

getTarget() 函数获取 ID 为 “Base” 的元素,在我们的例子中是 <base> 元素。基本元素目标属性分配给变量 x。然后使用 innerHTML() 属性在 ID 为 “Sample” 的段落中显示目标属性值。

function getTarget() {
   var x = document.getElementById("Base").target;
   document.getElementById("Sample").innerHTML = "Base target for all links is:" + x;
}

setTarget() 函数获取 ID 为 “Base” 的元素,在我们的例子中是 <base> 元素。 <base> 元素的目标属性然后设置为 “_blank” 意味着它将在新选项卡中打开。 “Target has been changed from newframe1 to _blank”然后显示在id为“Sample”的段落中。

相关用法


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