必须添加 target="_blank" 且配合 rel="noopener noreferrer" 才能安全地在新标签页打开链接；其他 target 值如 "_new" 无效，漏写下划线或未加 rel 属性会导致安全风险或当前页跳转。
怎么让 a 标签点击后在新标签页打开
默认情况下，<a href="..."> 点击会在当前页跳转。想新开标签页，必须加 target="_blank"，缺一不可。
常见错误是只写 target="blank"（漏了下划线）或 target="_new"（浏览器不认识），结果还是当前页跳转。
-
target="_blank"是唯一被广泛支持的新开页值 - 现代浏览器对
target="_blank"默认启用rel="noopener"安全策略（但老版本不会自动加） - 如果链接目标是第三方网站，务必手动补上
rel="noopener noreferrer"，否则可能被利用访问window.opener
正确写法：
<a href="https://example.com" target="_blank" rel="noopener noreferrer">示例链接</a>
target 还有哪些合法值？哪些已废弃
target 的合法值其实很少，多数是历史遗留或特定场景用：
立即学习“前端免费学习笔记（深入）”；
-
target="_self"：当前窗口/标签页（默认行为，可省略） -
target="_parent"：父级<iframe>的上下文（仅嵌套 iframe 时有意义） -
target="_top"：顶层窗口，常用于跳出多层 iframe -
target="framename"：匹配页面中某个<iframe name="...">或<frame name="...">，现在基本不用 -
target="_blank"是唯一推荐用于“新页”的值；其他如"_new"、"_window"均无效
不加 rel="noopener" 会有什么实际风险
当使用 target="_blank" 且没配 rel="noopener"，新页面可通过 window.opener.location 控制原页面跳转，甚至读取原页面 DOM —— 尤其当你链接到不受信站点时。
这个漏洞在 Chrome 88+ 后已默认为 noopener，但 Safari、旧版 Firefox 仍不自动添加。
- 攻击者可在新页执行
window.opener.location = "https://phishing.site"，把你的页面劫持走 -
rel="noreferrer"还能阻止 Referer 头泄露来源地址（隐私考虑） - 二者常一起写：
rel="noopener noreferrer"，顺序无关
在 Vue/React 等框架里写 a 标签要注意什么
框架本身不改变 a 标签语义，但容易因绑定方式出错：
- 别用
@click.prevent+window.open()替代原生a，这样会丢失 SEO 和右键菜单（如“复制链接”） - 动态生成
href时，确保值非空且是合法 URL，否则可能触发href="javascript:void(0)"类错误跳转 - SSR 场景下，
target="_blank"没问题，但window.open会报错（服务端无 window 对象） - 如果用
<router-link>（Vue）或<Link>（React Router），它们不支持target，得退回到原生a
该加的属性一个都不能少，框架再智能也绕不开 HTML 规范本身。
