可通过 window.location.href 获取当前页面完整 URL;其他属性如 protocol、host、pathname 等用于获取 URL 各部分;注意 SPA 中 history API 会更新 location,避免拼接重构 URL。

在 JavaScript 中,可以通过 BOM(Browser Object Model) 提供的 window.location 对象来获取当前页面的完整 URL 地址。
使用 location.href 获取完整 URL
这是最直接、最常用的方式,返回当前页面完整的绝对 URL 字符串:
-
window.location.href或简写为location.href(因为window是全局对象,可省略) - 返回值包含协议、域名、端口、路径、查询参数和哈希(如
https://example.com:8080/path/?a=1&b=2#section1) - 该属性可读可写,赋值会触发页面跳转(需注意安全与权限)
其他 location 属性用于拆解 URL
如果只需要 URL 的某一部分,location 还提供多个只读属性:
-
location.protocol:协议(如"https:") -
location.host:主机名 + 端口(如"example.com:8080") -
location.hostname:仅主机名(如"example.com") -
location.port:端口号(如"8080",默认端口如 80/443 通常为空字符串) -
location.pathname:路径部分(如"/path/") -
location.search:查询字符串(即"?a=1&b=2",开头带?) -
location.hash:哈希值(即"#section1",开头带#)
注意事项
这些属性都基于浏览器当前地址栏显示的 URL,受单页应用(SPA)路由影响:
- 在使用
history.pushState()或replaceState()后,location属性会同步更新 - 不建议用拼接各属性的方式重构完整 URL(因编码、空端口处理等细节易出错),优先用
href - 服务端渲染或 SSR 场景中,
window对象可能未定义,需先判断运行环境
不复杂但容易忽略。
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南











