<base>仅影响HTML解析时纯相对路径的拼接，对绝对URL、根路径及JS运行时跳转无效；必须置于<head>最前，且只对后续标签生效。
<base> 只影响 a 标签中**纯相对路径**（如 about.html、./contact/）的解析起点，对带协议的绝对 URL（如 https://example.com）或根相对路径（如 /admin/）完全无效。
base href 改变的是 HTML 解析阶段的路径拼接逻辑，不是运行时重写
浏览器在解析 HTML 文档时，一旦遇到 <base href="/app/">，后续所有未带协议、未以 / 开头的 href 值，都会被自动补上前缀。这个过程发生在 DOM 构建初期，不可逆，也不参与 JS 运行时的 URL 处理。
-
<a href="user/profile.html">→ 解析为https://site.com/app/user/profile.html -
<a href="./login">→ 解析为https://site.com/app/login -
<a href="https://other.com">→ 保持原样，<base>不介入 -
<a href="/static/css/main.css">→ 以/开头，直接相对于域名，跳过<base href>
base href 必须放在 <head> 最前面，否则对已解析的资源无效
HTML 是自上而下解析的。<base> 的作用范围仅限于它之后出现的标签。如果把它写在 <link rel="stylesheet" href="main.css"> 后面，那这个 CSS 文件早已按原始页面 URL 发起请求，<base> 对它毫无影响。
- ✅ 正确顺序：
<head><base href="/app/"><title>...</title><link href="style.css">...</head> - ❌ 错误顺序：
<head><link href="style.css"><base href="/app/">...</head>→style.css不受控 - ⚠️ 多个
<base>：只有第一个生效，Chrome 控制台会提示Multiple base elements detected. Only the first one is used. - ? 放在
<body>中：浏览器直接忽略，不报错也不警告
哪些链接看似“被 base 影响”实则只是巧合
开发者常误以为 <base href> 能统一控制所有跳转行为，但实际它只管“解析”，不管“导航”。以下情况和 <base> 无关：
立即学习“前端免费学习笔记（深入）”；
-
location.href = "dashboard"→ JS 运行时行为，不受<base>干预 -
<a href="javascript:void(0)" onclick="goHome()">→ 点击触发 JS，href 值未被用于导航 -
<a href="mailto:test@example.com">→ 协议特殊，不走 URL 解析流程 - CSS 中的
background: url(logo.png)→ 虽然受<base>影响（因是 HTML 解析时计算），但这是极少数例外，且仅限于<link>引入的样式表中的相对 URL；@import或内联style中的url()不受影响
base target="_blank" 不等于“所有外链新窗口”，且有安全硬伤
<base target="_blank"> 只对没显式写 target 的 <a> 和 <form> 生效，而且它不区分内外链——<a href="index.html"> 也会新开窗口。更关键的是，它不会自动加 rel="noopener noreferrer"，导致新开页可通过 window.opener 操控原页面。
- ❌
<base target="_blank">+<a href="https://evil.com">→ 新页可执行window.opener.location = 'https://phish.site' - ✅ 必须手动补全：
<a href="https://example.com" target="_blank" rel="noopener noreferrer"> - ⚠️ Safari 在某些
<iframe>嵌套场景下会忽略<base target>，需用脚本兜底：document.querySelectorAll('a[href^="http"]:not([target])').forEach(a => a.target = '_blank');
真正容易被忽略的一点：base 的 href 和 target 是解耦的。你可以只用 <base href="/app/"> 管资源路径，完全不用 target —— 这才是它最稳定、最无副作用的用法。一旦混用 target，就要同步处理安全性、可访问性和跨浏览器兼容性，成本远高于逐个写 target 和 rel。
