base标签仅在HTML解析阶段生效，仅改写硬编码的标签属性相对路径；fetch、import()、Worker等动态加载及CSS中@import均不受其影响，document.baseURI可手动构造URL但window.location不变。
base标签完全不作用于fetch、import()等动态加载
base 标签只在 HTML 解析阶段生效，仅改写硬编码在标签属性里的纯相对路径（如 <img src="logo.png">）。所有运行时动态行为都绕过它：fetch('./api')、import('./utils.js')、new Worker('./worker.js')、XMLHttpRequest.open('GET', 'data.json') 全部按当前页面 URL 或模块自身位置解析，和 <base href="/app/"> 无关。
CSS 中的 url() 受影响，但 @import 不受影响
background: url(avatar.jpg) 这类写在 HTML 的 <style> 标签内或内联 style 属性里的 CSS 路径，会在 HTML 解析时被 <base> 重写——因为浏览器把它们当作 HTML 属性值的一部分处理。但独立 CSS 文件中的 @import "reset.css" 是由 CSS 引擎自己解析的，走的是 CSS 文件所在路径，不受 <base> 控制。
document.baseURI 可用于手动构造 URL，但 window.location 不变
虽然 <base href="/subpath/"> 不改变 JS 运行时路径逻辑，但它会影响 document.baseURI 的返回值。你可以用它安全拼接路径：new URL('data.json', document.baseURI) 得到 https://example.com/subpath/data.json。但注意：window.location、document.URL 和 location.href 完全不变，别误以为页面“跳转”了。
动态创建元素的 src/href 也不走 base
哪怕你写了 <base href="/cdn/">，下面这段代码仍按当前页面 URL 解析：const img = document.createElement('img'); img.src = 'logo.png'; → 请求的是当前页同目录下的 logo.png，不是 /cdn/logo.png。同理：element.style.backgroundImage = "url(bg.jpg)" 按 CSS 规则解析（相对于 CSS 文件位置），与 <base> 无关。
立即学习“前端免费学习笔记（深入）”；
真正麻烦的不是 base 本身，而是误以为它能统一所有路径——结果 API 请求 404、动态 import 失败、Worker 加载不到，都是因为混淆了 HTML 静态解析和 JS 运行时两个完全隔离的路径系统。
