HTML外部链接打开方式设置方法

golang学习网今天将给大家带来《HTML中可通过target属性设置外部链接的打开方式。常用值有：_blank：在新标签页打开（推荐用于外部链接）_self：在当前标签页打开（默认值）_parent：在父框架中打开_top：在整个窗口中打开，忽略框架示例代码：访问外部网站优化后的SEO标题： HTML如何设置外部链接打开方式》，感兴趣的朋友请继续看下去吧！以下内容将会涉及到等等知识点，如果你是正在学习文章或者已经是大佬级别了，都非常欢迎也希望大家都能给我建议评论哈~希望能帮助到大家！

控制HTML外部链接打开方式最直接的方法是使用target="_blank"，同时需添加rel="noopener noreferrer"以防止安全风险。此外，target属性还支持_self（默认，在当前页打开）、_parent（在父框架打开）和_top（在顶层窗口打开），但除_blank外，其他值在现代网页设计中较少使用。

控制HTML中外部链接的打开方式，最直接的方法就是利用target属性。通常，我们希望外部链接能在新的浏览器标签页或窗口中打开，以保持用户当前页面的不中断。

解决方案

核心在于（锚点）标签里的target属性。当你需要一个链接在新标签页或新窗口中打开时，将其设置为target="_blank"。这很简单，比如：访问示例网站。除了_blank，还有一些其他值，如_self（在当前框架或窗口中打开，这是默认行为）、_parent（在父框架中打开）和_top（在整个窗口中打开）。但对于指向站外资源的链接，_blank几乎是唯一的选择。

为什么外部链接常会选择在新标签页打开？

这其实是出于多方面的考量，尤其是在用户体验和网站自身流量管理上。

从用户体验（UX）的角度看，当用户点击一个指向外部网站的链接时，如果当前页面被直接替换掉，他们可能会感到困惑或不便。想象一下，你正在阅读一篇深度文章，里面引用了一个外部资料，你点击后，文章页面就消失了。这无疑会打断阅读流程，甚至可能让用户忘记回到你的网站。让链接在新标签页打开，意味着用户的主动阅读进程不会被打断，他们可以随时回到你的页面继续浏览。这是一种对用户选择权的尊重，也是一种更流畅的导航体验。

对于网站运营者来说，这直接关系到网站的“留存率”。如果用户因为点击外部链接而离开了你的网站，他们可能就此一去不复返。而新标签页的策略，确保了你的网站始终在后台保持开放，用户可以轻松地切换回来。这就像是给用户留了一条“后路”，让他们在探索外部世界的同时，你的“家”依然亮着灯。虽然看起来只是一个小小的技术细节，但它在无形中帮助你的内容保持了更高的可见度和可访问性。有时候，我甚至会觉得，这是一种微妙的“挽留”策略，但它的出发点确实是提升用户体验。

使用 target="_blank" 是否存在安全隐患，又该如何规避？

是的，target="_blank"确实存在一个被称为“Tabnabbing”（标签劫持）的安全隐患，如果处理不当的话。这听起来有点像间谍电影里的情节，但它在网络世界中是真实存在的。

具体来说，当你使用target="_blank"打开一个新标签页时，新打开的页面（外部网站）可以通过window.opener这个JavaScript对象，访问并修改原始页面（你的网站）的一些属性。最常见的攻击方式就是，恶意网站会利用window.opener.location来将你的原始页面重定向到一个看起来很像你网站的钓鱼页面。比如，它可能伪装成一个登录失效的提示，诱导用户重新输入账号密码。当用户从新标签页切换回你的网站时，看到的是一个假冒的登录页，如果不加注意，就可能泄露敏感信息。这是一种非常隐蔽的攻击，因为它利用了浏览器标签页之间的信任关系。

幸运的是，解决这个问题的方法非常简单且有效：在你的标签中同时添加rel="noopener noreferrer"属性。

• noopener：这个属性的作用是阻止新打开的页面访问window.opener对象，从而切断了两个标签页之间的联系。这是防止Tabnabbing攻击的关键。
• noreferrer：这个属性则更进一步，它告诉浏览器在打开新页面时，不要发送HTTP Referer头信息。这意味着新页面将不知道用户是从哪个网站跳转过来的。这不仅增加了用户的隐私保护，也间接强化了安全性，因为它减少了信息泄露的可能性。

所以，一个安全的外部链接应该像这样：访问外部资源。这几个小小的属性，为你的用户和网站筑起了一道重要的安全防线。我个人觉得，任何用到target="_blank"的地方，都应该把rel="noopener noreferrer"当作标配，这已经成了我写HTML时的一个习惯动作。

除了 _blank，还有哪些 target 值，它们在什么场景下有用？

除了最常见的_blank，HTML的target属性还有几个内置值，以及支持自定义命名。它们在特定的场景下会有用，但坦白说，在现代网页设计中，它们的使用频率远不如_blank。

• _self (默认值): 这是当你没有指定target属性时的默认行为。链接会在当前浏览上下文（也就是当前标签页或窗口）中打开。这非常适合内部链接，比如你的网站导航、文章内部的跳转链接。用户点击后，当前页面会被新内容替换，这符合用户在网站内部进行导航的预期。比如，从首页点击“关于我们”，你肯定希望它在同一个页面里加载出来，而不是弹出一个新窗口。

• _parent: 这个值专门用于当你的网页被嵌入在