用
标签设置整个文档的基准 URL
HTML 中唯一能定义文档基础 URL 的方式就是
标签,它必须写在
里,且只生效一次(多个
时,只有第一个被浏览器解析)。
常见错误是把它放在
里,或者动态插入——这完全无效,浏览器只在初始解析
时读取它。
:所有相对路径(如
、
)都会自动拼接成
这类完整地址
:可统一设置所有
、
等标签的默认打开方式,但会覆盖单个链接的
属性
如果同时设
和
,两个都生效;但不能只写
而不带
,否则
不起作用(部分旧浏览器行为不一致)
对资源加载和跳转的实际影响
它不改变 JavaScript 中的
或
,也不影响 CSS 里的
(CSS 中的相对路径仍以 CSS 文件自身位置为基准),但它会直接影响 HTML 解析器对所有相对 URL 的解析逻辑。
典型踩坑场景:
立即学习
“
前端免费学习笔记(深入)
”;
单页应用(SPA)中,路由用
切换路径后,用户刷新页面,浏览器按当前 URL 加载 HTML —— 如果该 HTML 里有
,而服务器没把所有路由都 fallback 到 index.
html
,就会 404
本地开发时用
协议打开 HTML,
是合法的,但
在
下可能因路径解析规则不同而失效
内部的相对链接不受父页面
影响,子文档需自己定义
替代方案:什么时候不该用
当项目已用构建工具(如 Webpack、Vite)处理静态资源路径,或后端模板引擎(如 EJS、Jinja)能自动注入绝对路径时,硬加
反而容易造成路径重复或错乱。
使用HTML,CSS,JavaScript开发Android应用程序 英文文字pdf版附源文件
如果你了解HTML,CSS和JavaScript,您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造,可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序,然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流,并开始构建应用程序,提供更
下载
更可控的做法:
用
配合 JS 动态补全(仅用于业务逻辑,不影响原生资源加载)
服务端渲染时,在每个链接生成阶段就拼好绝对路径,比如
CDN 场景下,直接在 HTML 模板里写完整 URL:
,比依赖
更透明
验证
是否生效的最快方法
打开浏览器开发者工具,在控制台运行:
—— 它返回的就是当前生效的基础 URL。如果返回的是当前页面 URL,说明
没写对位置、被忽略,或根本没写。
另一个信号是检查网络面板:点开一个相对路径的请求(比如
),看它的「Initiator」列是否指向 HTML 文档,且请求地址是拼接后的完整路径。如果不是,大概率是
未生效或被其他机制覆盖。
最麻烦的情况是:它生效了,但你忘了某些地方本该用绝对路径(比如 API 接口地址写成
),结果被
错误地变成
—— 这种问题不会报错,只会静默失败。
https://example.com/assets/logo.pngtargethreftargethreftargetwindow.locationdocument.URLurl()history.pushStatefile://file://document.baseURIlogo.png/api/userhttps://cdn.example.com/api/user