JavaScript 中怎么通过 BOM 解析 URL 中的查询参数-js教程-PHP中文网

推荐优先使用 URLSearchParams 解析当前 URL 查询参数，它原生支持、语义清晰、兼容性好；可直接作用于 window.location.search，提供 get、getAll、has、forEach 等方法。

javascript 中怎么通过 bom 解析 url 中的查询参数

JavaScript 中可以通过 BOM（Browser Object Model） 提供的 window.location 对象获取当前 URL，并结合字符串处理或 URLSearchParams API 解析查询参数。推荐优先使用 URLSearchParams，它原生支持、语义清晰、兼容性良好（现代浏览器及 IE10+ 需 polyfill）。

用 URLSearchParams 解析当前 URL 的查询参数

URLSearchParams 是最简洁可靠的方式，直接作用于 window.location.search（即问号后的部分）：

window.location.search 返回类似 "?name=John&age=25&city=Beijing" 的字符串
new URLSearchParams(window.location.search) 创建一个可遍历的参数对象
支持 .get()、.getAll()、.has()、.forEach() 等方法

示例：

const params = new URLSearchParams(window.location.search);
console.log(params.get('name'));   // "John"
console.log(params.get('age'));    // "25"
console.log(params.has('city'));   // true
params.forEach((value, key) => {
  console.log(`${key} = ${value}`);
});

手动解析（兼容极旧环境，如无 URLSearchParams 的 IE9）

若需支持非常老的浏览器，可对 window.location.search 字符串做分割和解码：

Java注释规范Skills

当用户要求为 Java 代码添加注释、修改注释、审查注释、整理注释格式，或要求按照代码注释规范处理 Java 文件时，使用本技能。本技能用于统一生成和维护 Java 类注释模板、按 Git 对比 release 判断版本号、补充每行代码上方中文块注释、调整注释空行规则，并保持 Java 文件 UTF-8 无 BOM 编码。典型触发场景包括：补充类注释、更新 @version、检查 @author 来源、整理行尾注释、把注释放到代码上一行、检查注释是否符合规范、构建前检查 Java 注释风格。

下载

去掉开头的 "?"，用 & 拆分成键值对数组
每个键值对再用 = 拆分，分别对 key 和 value 调用 decodeURIComponent()
注意处理空值、重复键（可存入数组或覆盖）

简易实现：

function getQueryParams() {
  const search = window.location.search.substring(1);
  const result = {};
  if (!search) return result;
  search.split('&').forEach(pair => {
    const [key, value] = pair.split('=').map(decodeURIComponent);
    if (key) {
      result[key] = value !== undefined ? value : '';
    }
  });
  return result;
}
// 使用
const query = getQueryParams();
console.log(query.name); // "John"

解析任意 URL 字符串（不局限于当前页面）

如果要解析其他 URL（比如接口返回的链接），可先构造 URL 实例，再取其 searchParams：

new URL('https://example.com/?a=1&b=2').searchParams 同样返回 URLSearchParams 对象
该方式更健壮，自动处理编码、协议、路径等边界情况

示例：

const url = new URL('https://test.com/path?tag=js&sort=desc&filter=active');
const params = url.searchParams;
console.log(params.get('tag'));     // "js"
console.log(params.getAll('filter')); // ["active"]

注意事项与常见坑

URLSearchParams 的 .get() 只返回第一个匹配值；有重复参数名时，用 .getAll()
参数值可能被 URL 编码（如空格变 %20），URLSearchParams 内部已自动解码，无需额外调用 decodeURIComponent
window.location.search 在 hash 路由（如 #/home?x=1）中为空，此时需从 hash 中提取（例如 window.location.hash.split('?')[1]）
服务端渲染或静态页面中，确保脚本在 DOM 加载后执行，避免读取时机过早

Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南