base标签的target属性的作用：HTML全局链接打开方式使用方法
作者：袖梨
2026-07-27
base 标签的 target 属性为当前页面所有未显式声明 target 的 和 <form> 元素提供默认目标，仅影响无 target 属性的元素，不自动添加 rel="noopener"，存在安全与行为干扰风险。
base 标签的 target 属性到底控制什么
<base> 的 target 属性不是“给某个链接设打开方式”，而是为**当前页面所有未显式声明 target 的 <a> 和 <form> 元素**提供默认目标。它只影响那些没写 target 的标签，一旦你在某个 <a href="..." target="_blank"> 里写了，就完全绕过 <base>。
为什么加了 <base target="_blank"> 后所有链接都新标签打开了
这是预期行为，但容易误用：
- 它会影响所有相对路径链接（如
<a href="about.html">）、绝对路径链接（如<a href="/contact">），甚至部分协议完整链接（除非你显式覆盖） -
<form>提交也会走这个默认target，可能造成表单提交后跳转到新标签页，打断用户流程 - 如果页面里有内嵌
<iframe>，且用了target="myframe"这类命名目标，<base target>会干扰其行为——除非你同时配了href并确保命名一致 - 现代浏览器对
<base target="_blank">不自动补rel="noopener"，这意味着从新标签页能通过window.opener反向控制原页面，存在安全风险
如何安全地用 base 统一控制链接打开方式
真要用，得配合显式防护和边界控制：
- 必须把
<base>放在<head>最前面，且整个文档只能有一个 - 如果只希望影响链接、不碰表单，就别依赖
<base target>，改用 JS 批量加属性或 CSS-in-JS 注入逻辑 - 若坚持用
target="_blank"，务必在每个实际<a>上补rel="noopener noreferrer"——<base>不帮你加这个 - 测试时重点检查：锚点链接（
href="#section"）、空链接（href="#"）、JavaScript 链接（href="javascript:void(0)"）是否被意外带上新窗口行为
替代方案比 base target 更可控
多数真实项目里，<base target> 是个“省事但埋雷”的选择：
立即学习“前端免费学习笔记（深入）”；
- 用 CSS 类 + JS 监听（如
document.querySelectorAll('a[data-blank]')）更灵活，还能按需加rel - 构建时用模板引擎或预处理器批量注入属性，比运行时靠 HTML 解析更可靠
- 对于 SSR 页面，直接在服务端渲染阶段判断上下文（如是否移动端、是否 iframe 内），动态决定是否加
target -
<base>的target在 Web Components 或 Shadow DOM 中作用范围有限，容易失效
真正难处理的不是怎么设，而是设完之后谁会受影响、谁会被漏掉、谁会因此变慢或不安全——这些细节往往在上线后才暴露。
