有没有一种优雅的方法可以在可以重复使用的新选项卡中打开外部链接

Is there an elegant way to open external links up in a new tab which can be re-used?

本文关键字：新选项 选项 链接 外部 一种 方法 有没有      更新时间：2023-09-26

所以这是我到目前为止正在做的事情：

<script>
var win;
function OpenInNewTab(url )
{
  // var win;
  if (win)
  {
     win.close();
  }
  win   =window.open(url, 'myWin');
  win.focus();
}
</script>

然后我的链接是这样的（为了利用Javascript函数）：

<li><a href="#" onclick="OpenInNewTab('http://www.anti-agingfirewalls.com/');">Anti-Aging Firewalls</a></li>

问题是，对于我页面上的所有 URL，此解决方案无法向上缩放。这意味着我必须为我想以这种方式行为的每个 URL 调用 onclick。有没有一种优雅的方法来扩展此解决方案，这样我就不必为每个链接输入"onclick"？（或者至少减少继续输入此内容所需的工作量？

只需使这些链接具有正常的href值（即链接将指向的URL），并为它们提供rel属性值external，以指示您希望它们在新选项卡中打开。然后，只需对此属性值进行一个小的 JavaScript 代码段搜索，然后对其进行更改，以便链接在新选项卡中打开。

这很好，因为即使 JavaScript 被禁用或失败，链接仍然有效。

<li><a href="http://www.anti-agingfirewalls.com/" rel="external">Anti-Aging Firewalls</a></li>
<script>
function externalLinks() {
 if (!document.getElementsByTagName) return;
 var anchors = document.getElementsByTagName("a");
 for (var i=0; i<anchors.length; i++) {
   var anchor = anchors[i];
   if (anchor.getAttribute("href") &&
       anchor.getAttribute("rel") == "external")
     anchor.target = "_blank";
 }
}
window.onload = externalLinks;
</script>

这篇文章很旧，但解释得很好。如果你使用像jQuery这样的框架，它也可以简化。

将

target="_blank"添加到锚点是最简单的方法。

<a href="#" target="_blank">anchor</a>

如果您不想修改页面中的每个锚元素（这是肮脏的工作），您可以在<head>中添加一个<base>元素：

<base target="_blank">

或者，您可以使用JavaScript在DOM ready上批量添加该属性：

var anchors = document.getElementsByTagName('a');
for (var i = 0; i < anchors.length; i++) {
    anchors[i].target = "_blank";
}
为什么

你在这里不使用目标属性？

a href="some like here" target="_blank">Google

"

可以重用"，是的，绝对。

使用目标属性，但不要将其设置为 _blank，而是为其命名。

以下标记会将链接打开到一个新的空选项卡中，因此单击三个链接将打开三个选项卡：

<a href="/path/to/link" target="_blank">click here</a>

但是以下标记会将链接打开为单个指定的选项卡，当后续链接被重用时：

<a href="/path/to/link" target="mytab">click here</a>
将目标

设置为所需的任何名称，指向该目标的所有链接将可预测地在同一选项卡中打开。如果尚不存在具有该名称的选项卡，则将打开一个新选项卡。

自从Netscape引入帧以来，这个功能就已经存在了。今天，大多数人只使用_self或_blank作为目标，但使用命名目标仍然像以前一样有效。

相关文章：