在 HTML5 中使用 target="_blank" 可以吗？答案

【问题标题】：Is it alright to use target="_blank" in HTML5?在 HTML5 中使用 target="_blank" 可以吗？
【发布时间】：2011-05-11 01:43:47
【问题描述】：

我记得在某处读过，在 HTML5 中不再可以在 HTML5 中使用 target="_blank"，但我现在找不到它。

可以继续使用target="_blank"吗？

我知道这通常被认为是一个坏主意，但它是为 PDF 之类的内容打开新窗口的最简单方法，而且它也不需要您依赖 JavaScript。

【问题讨论】：

一般来说，如果您想从您的网站打开一个外部网站，那么在我看来，打开一个新窗口（这可能是当今大多数浏览器上的一个新标签页）是一个更好的主意。跨度>
@hobbes3，请不要再弄乱我的导航和历史记录了。我是浏览的人，是我决定一个链接是在新的（中键单击）还是在同一个（左键单击）选项卡中打开。当我遇到一个网站强迫我遵循其“正当的最佳实践”打开新标签页中的每个链接时，我会立即并欣然离开。
@Albireo，这只是我的观点，一些流行的 Web 服务也包含相同的想法。例如，默认情况下，在 Gmail 中单击邮件中的链接会打开一个新窗口。
@Albireo 你假设用户总是和你一样先进和精通技术。
target 等人是有原因的。存在。有时它们是必需品。具有状态 JS 的动态生成页面，例如，iframe 不如新选项卡可取（例如，查看 PDF，如 OP 所述）。或者当安全站点（例如银行）将您发送到外部链接但由于内容过期而不允许使用后退按钮时。像所有东西一样，使用这个 HTML 属性并不是一个“坏主意”，但应该谨慎使用它，就像所有编程中的每个库、类、函数和属性一样。

标签： javascript html window

【解决方案1】：

看起来target="_blank" 还可以。它在the latest HTML5 draft 中被列为浏览上下文关键字。

【讨论】：

target="_blank" 将导致每次用户单击链接时打开一个新窗口。除非这确实是您想要发生的事情（而且很少发生），否则请考虑使用target="somethingUnique"，以便用户只能打开一个窗口，即使他们多次单击该链接也是如此。它使用户体验更好。
@BanksySan：我认为target="_blank" 很好的一个例子是分享按钮。
如果我正在阅读一篇长文章，并且在另一个站点（或同一个站点）上引用了一些相关信息。我经常想在两者之间来回跳动，而不会失去我在原始文章中的位置。 target="_blank" 非常适合这个。离开页面并不得不交替重新加载每个页面（通常在任一页面中失去我的位置），不是。是的，我知道我可以右键单击链接并在新选项卡中打开它，但我不想这样做，因为它会分散我的注意力，而且我怀疑大多数网络用户不知道如何操作。
target 属性有很多好处。我不会disq那个。弹出式广告商破坏了它的目的，但今天有如此多的服务在浏览体验之外运行，许多人不想离开当前的文章或标签，但仍然与大量下载的 PDF 或视频进行交互。使用 _blank 确保您让用户填充一个空选项卡 - 如果您在同一个会话/站点上提供许多链接，则不要覆盖当前填充的内容。在包含 90 首歌曲的音频列表中，唯一的名称只是混乱.... Viva la target, viva la _blank...

【解决方案2】：

可以使用target="_blank"；这在 XHTML 中被取消了，因为在大多数浏览器中定位新窗口总是会弹出弹出警报。 XHTML 将始终在验证中显示带有目标属性的错误。

HTML 5 将它带回来，因为我们仍在使用它。这是我们的朋友，我们不能放手。

永远不要放手。

【讨论】：

您声称的内容仅对 HTML 严格有效。
对于 XHTML 以及对于 HTML。

【解决方案3】：

虽然target="_blank" 是acceptable in HTML5，但我个人尽量不要使用它（即使是在新窗口中打开PDF）。

HTML 应该定义含义和内容。问问自己，“如果target 属性被删除，a 元素的含义会改变吗？”如果没有，代码不应该进入 HTML。（实际上我很惊讶 W3C 保留了它……我猜他们真的不能放手。）

浏览器行为，特别是与用户的交互行为，应该使用客户端脚本语言（如 JavaScript）来实现。由于您希望浏览器以特定方式运行，即打开一个新窗口，因此您应该使用 JS。但正如你所提到的，这种行为需要浏览器依赖 JS。（虽然如果你的网站优雅降级，或者逐渐增强，or whatever，那应该还是可以的。禁用 JS 的用户不会错过太多。）

话虽如此，这些都不是正确的答案。 Out there somewhere 的观点是，链接的打开方式最终应由最终用户决定。举这个例子。

您正在浏览维基百科，越陷越深。您在阅读中遇到了一个链接。

假设您想在返回之前快速浏览链接的页面。您可以在新选项卡中打开它，然后在完成后将其关闭（因为点击“返回”按钮并等待页面重新加载需要太长时间）。或者，如果它看起来很有趣并且您想保存以备后用怎么办？也许您应该在新的背景选项卡中打开它，并继续阅读当前页面。或者，也许您决定已阅读完此页面，因此您只需点击当前标签中的链接即可。

关键是，您有自己的工作流程，并且您希望浏览器能够相应地运行。如果它为您做出这些决定，您可能会感到非常沮丧。

话虽如此，网络开发人员应该绝对清楚地说明他们的链接去向、他们引用的来源的类型和/或格式以及他们的作用。工具提示可以成为您的朋友（除非您使用的是平板电脑或手机；在这种情况下，请在移动网站上指定这些）。我们都知道被带到我们没有预料到的地方或发生一些我们不打算发生的事情是多么糟糕。

【讨论】：

如果有人足够聪明地设计了一个用户小部件，允许人们非常轻松地行使上帝赋予的对每个链接的控制权（很容易，就像在潜意识中一样），那么它应该被添加到浏览器和所有标签都可以提供它。
在我看来，这个答案在逻辑和架构上是最准确的。在一个理想的世界里，作者应该更关心块的正确语义识别，而不是预先确定块的行为。在新兴的自适应内容世界中，窗口行为可能取决于请求时哪个响应主题或用户偏好有效；传出语义“事物”仅在必要时通过转换（DOM 或正则表达式、服务器或浏览器）进行修改。通过这种方式，窗口行为可以由用户而不是 CMS 中的作者来决定。

【解决方案4】：

这是为 PDF 之类的内容打开新窗口的最简单方法

这也是惹恼非 Windows 用户的最简单方法。 PDF 在其他平台的浏览器中打开得很好。在智能手机等较小的平台上打开新窗口还会弄乱导航历史记录并使事情复杂化。

不要仅仅因为旧版本的 Windows 已损坏而打开新窗口以显示 PDF 等内容。

【讨论】：

知道告诉人们不要使用某些东西有什么帮助吗？向他们展示 to 使用什么，HTML5 下载属性：etc。

【解决方案5】：

大多数网络开发人员使用target="_blank" 仅在新标签页中打开链接。如果您仅使用target="_blank" 在新选项卡中打开链接，那么它很容易受到攻击者的攻击。当您在新选项卡 (target="_blank") 中打开链接时，在新选项卡中打开的页面可以访问初始选项卡并使用 window.opener 属性更改其位置。

Javascript 代码：

window.opener.location.replace(malicious URL)

预防：

rel="nofollow noopener noreferrer"

More about the attribute values.

【讨论】：

我不确定 nofollow 是否与安全有关——它适用于搜索引擎机器人。
@DarrylHein noreferrer too

【解决方案6】：

虽然目标在 HTML5 中仍然可以接受，但它不是首选。要链接到 PDF 文件，请使用 download 属性而不是 target 属性。

这是一个例子：

<a href="files/invoice.pdf" download>Invoice</a>

如果原始文件名被编码为唯一的文件存储，您可以通过为下载属性分配一个值来指定一个用户友好的下载名称：

<a href="files/j24oHPqJiUR2ftK0oeNH.pdf" download="invoice.pdf">Invoice</a>

请记住，虽然大多数现代浏览器支持此功能，但有些可能不支持。请参阅caniuse.com 了解更多信息。

【讨论】：

【解决方案7】：

确实如此！

http://www.w3.org/TR/2010/WD-html5-20100624/text-level-semantics.html#the-a-element

【讨论】：

@Gumbo 回来了。有关当前版本的规范，请参见 mike 的链接。

【解决方案8】：

我认为<link> 元素不推荐使用目标属性，而不是<a>，这可能就是您听说它不应该再使用的原因。

【讨论】：

【解决方案9】：

你可以用jquery通过以下方式来做，这将在一个新窗口中打开它：

<input type="button" id="idboton" value="google" name="boton" /> 

<script type="text/javascript">
    $('#idboton').click(function(){
        window.open('https://www.google.com.co');
    });

</script>

【讨论】：

为什么不在带有 target="_blank" 的按钮周围添加一个表单。似乎这样会更容易，并且不需要 JS。