javascript 中不存在“bom 路由”概念，实际是通过 window.location 操作 url 查询参数；推荐用 urlsearchparams 获取（get/getall/has）和修改参数，配合 history.replacestate 或 pushstate 更新 url 而不刷新页面；避免直接修改 href 或手动拼接字符串。
JavaScript 中 BOM 路由本身没有“BOM 路由”这个概念，实际指的是通过 window.location（属于 BOM）操作当前页面 URL，尤其是查询参数（query string）。获取和修改 URL 参数不依赖路由库（如 Vue Router、React Router），而是直接操作原生 URL 对象或字符串。
获取 URL 查询参数（推荐用 URLSearchParams）
URLSearchParams 是现代浏览器原生支持的 API，简洁可靠，自动处理编码解码：
- 获取所有参数：const params = new URLSearchParams(window.location.search)
- 读取单个值：params.get('id') → 返回字符串（若存在多个同名参数，只返回第一个）
- 读取全部同名值：Array.from(params.getAll('tag'))
- 检查是否存在：params.has('page')
修改 URL 参数（不刷新页面）
使用 history.replaceState() 可更新地址栏 URL 而不触发页面跳转或重新加载：
JavaStoryDevelop
下载
你接手一个需求时，是不是经常这样："改一个小字段 → 结果把不相关的代码也改了"、"需求说得很模糊 → 做着做着发现跑偏了"、"数据库加个字段 → 上线才发现漏了数据兼容"、"做了个新功能 → 一个月后自己都忘了当时怎么设计的"、"写到一半被中断 → 再回来不知道从哪继续"；这个 Skill 就是专门解决这些问题的。 它会自动探测你的项目环境（JDK、Spring Boot、ORM、数据库、前端框架），记在
- 先构造新 search 字符串：const newParams = new URLSearchParams(window.location.search); newParams.set('page', '2');
- 拼接完整 URL：const newUrl = `${window.location.pathname}?${newParams.toString()}`;
- 更新浏览器地址栏：history.replaceState(null, '', newUrl);
注意：replaceState 不会添加历史记录，适合“修正参数”；若需前进/后退支持，用 history.pushState()。
兼容旧浏览器（IE 等不支持 URLSearchParams）
可手动解析 query string，但需自行处理编码与分割逻辑：
- 提取 search 部分：const queryString = window.location.search.slice(1);
- 按 & 拆分，再按 = 分割键值，注意 decodeURIComponent 解码
- 建议封装为简单函数，例如 parseQuery(queryString) → { key: value } 对象
常见误区提醒
- window.location.href 修改会强制刷新页面，不适合仅改参数
- 直接拼接字符串易出错（遗漏 ?/&、未编码特殊字符），优先用 URLSearchParams
- hash（# 后部分）与 search（? 后部分）是不同区域，修改 hash 应用 window.location.hash
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
