必须同时写 target="_blank" 和 rel="noopener noreferrer"，仅 target="_blank" 会被现代浏览器降级为当前页跳转；前者控制新开标签页，后者切断 window.opener 访问并隐藏来源，缺一不可。

要在新标签页打开链接，必须写 target="_blank"，但仅这样还不够——现代浏览器会因安全策略将其降级为当前页跳转，除非同时加上 rel="noopener noreferrer"。

正确写法：必须两个属性一起用

只加 target="_blank" 是不完整的。标准、安全、兼容的写法是：

• target="_blank" 告诉浏览器开新标签页
• rel="noopener noreferrer" 切断新页面对原页面的控制权，防止被劫持，也隐藏来源地址
• 两个属性可放在 @#@#@#@#@#@#@#@#@#@0 <h3>常见错误写法及后果</h3> <p>这些看似相似的写法，实际效果可能完全不是你想要的：</p><div class="aritcle_card flexRow artxards"> <div class="artcardd flexRow"> <a class="aritcle_card_img" rel="nofollow" href="/xiazai/skill8291" title="page-agent 浏览器控制（CDP）"><img src="https://img.php.cn/upload/skill/000/000/081/179196125775037.jpg" alt="page-agent 浏览器控制（CDP）" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a> <div class="aritcle_card_info flexColumn"> <a rel="nofollow" href="/xiazai/skill8291" title="page-agent 浏览器控制（CDP）" class="overflowclass">page-agent 浏览器控制（CDP）</a> <p class="overflowclass">使用 page-agent CLI（CDP）控制浏览器；CLI只能通过 GitHub Release 的 .tgz 安装，npm 官方包暂未发布。</p> </div> <a rel="nofollow" href="/xiazai/skill8291" title="page-agent 浏览器控制（CDP）" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a> </div> </div> <ul> <li> <code>target="blank"（漏下划线）→ 浏览器当普通字符串处理，等同于 target="_self，仍在当前页打开
• target="_new" 或 target="new" → 非标准值，所有主流浏览器都忽略，退化为当前页
• 只写 rel="noreferrer" 却漏掉 noopener → Safari 旧版仍可能暴露 window.opener，存在安全风险
• href="#" 或 href="" → 即使加了 target="_blank"，也不会跳转，因为没真实目标

动态生成链接时怎么保证安全

JavaScript 拼接 HTML 字符串容易漏掉 rel。更稳妥的方式是用 DOM API 显式设置：

• 用 document.createElement('a') 创建元素
• 依次赋值：link.href = url、link.target = '_blank'、link.rel = 'noopener noreferrer'
• 插入前检查 link.outerHTML，确认三项都在

服务端模板（如 PHP、Jinja）中也要统一补全 rel，不能依赖前端修补。

哪些场景不能只靠 target="\_blank"

某些环境会限制或忽略该属性：

• 微信内置 WebView、部分旧版安卓浏览器：可能直接无视 target，需改用 window.open(url, '_blank')
• 富文本编辑器或 CMS：常过滤 rel 属性，要检查后端白名单配置
• 严格 CSP 策略下：若未允许 popup，控制台会报错 Refused to open a window
• Vue/React 中用 <router-link></router-link> 或封装组件：它们不支持 target，必须退回原生 <a></a> 标签

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！