a标签跳转打开新页面

点开一个链接，签跳当前页面直接跳走，转打这是开新浏览器默认行为。但有时候你希望用户点一下，页面新页面在另一个标签页里打开，签跳原来的转打页面还在。加一个属性就能做到：target="_blank"。开新

就这么简单。页面可这简单背后，签跳有几个坑我踩过不止一次。转打

早年间做企业官网，开新导航栏里挂了一堆合作伙伴的页面外链。没加 target="_blank"，签跳用户点出去就回不来了，转打流量白白送给别人。开新后来学乖了，所有外链一律新窗口打开。但很快发现另一个问题——新打开的页面，居然能通过 window.opener 拿到原页面的引用，甚至能改原页面的地址。这就是所谓的“反向标签劫持”。

安全圈的朋友给我演示过：一个恶意页面被 target="_blank" 打开后，用一行 JS 把原标签页重定向到钓鱼网站。用户以为只是开了个新窗口，回头一看，原来的页面已经变了。修复方法也简单，加上 rel="noopener"。现代浏览器其实已经默认给 target="_blank" 加了 noopener 行为，但显式写出来更稳妥，尤其是还要兼容老版本的时候。

还有个属性叫 rel="noreferrer"。它除了切断 opener 引用，还会阻止浏览器发送 Referer 头。有时候你不想让对方服务器知道用户是从哪个页面点过来的，这个就派上用场了。不过要留意，某些统计工具依赖 Referer 来追踪来源，加了 noreferrer 数据就断了。用不用，看场景。

说到场景，不是所有新窗口都该用 target="_blank"。站内链接如果也这么干，用户开了一堆标签页，体验反而糟糕。我自己的判断标准很粗暴：链接指向站外，或者明确是辅助性内容（比如帮助文档、条款说明），才新开。站内主导航、文章间的跳转，老老实实当前页刷新。

另外提一句，target 还有其他值，比如 _self（默认，当前页）、_parent、_top。后两个主要用在 iframe 嵌套的场景里，日常开发碰得少。_blank 是使用频率最高的一个。

写法上没什么花头：

<a href="https://example.com" target="_blank" rel="noopener noreferrer">外部链接</a> 

三个属性各司其职。href 管去哪，target 管在哪开，rel 管安全与隐私。顺序无所谓，但建议 rel 紧跟在 target 后面，读代码的人一眼能看出这链接是“新窗口+安全模式”。

有个细节很多人忽略：如果 href 是 javascript:void(0) 或者 #，target="_blank" 基本没意义。前者不产生导航，后者在当前页锚点跳转，新窗口打开一个空锚点，纯属添乱。该用 button 的地方别硬套 a 标签。

移动端又是另一回事。手机浏览器对 target="_blank" 的处理不统一，有的开新标签，有的直接当前页跳。用户感知不到“新窗口”这个概念，标签页在移动端本来就弱化。所以做响应式站点时，别太依赖 target="_blank" 来保留用户当前进度，该做的表单保护、草稿保存，一样不能少。

最后说个观察。很多 CMS 和富文本编辑器默认给所有链接加 target="_blank"，编辑根本不知道。结果站内文章互相引用，全在新标签打开，用户点两下就满屏标签页。这种默认行为挺烦人的。如果你在维护内容平台，不妨把“是否新窗口打开”做成一个可选项，让编辑自己决定，而不是一刀切。

一个属性而已，用对了省事，用错了添堵。知道它背后发生了什么，比记住写法更重要。