使用 window.location.search 获取参数反应 - JavaScript

在 JavaScript 中，你可以使用 window.location.search 属性来获取当前页面的查询参数。这个属性返回的是 URL 中的查询字符串，包括问号 ?。

获取查询参数

假设你的当前页面的 URL 是：https://example.com/?name=John&age=25。下面是如何使用 window.location.search 获取这些查询参数的示例代码：

const queryString = window.location.search;
console.log(queryString);

输出结果为：

?name=John&age=25

解析查询参数

你可以使用不同的方法来解析查询参数。下面是两种常见的解析方法：

1. 使用 split() 方法

可以使用 JavaScript 的 split() 方法将查询字符串分割成键值对数组。

const queryString = window.location.search;
const params = queryString.slice(1).split('&').reduce((acc, param) => {
  const [key, value] = param.split('=');
  acc[key] = decodeURIComponent(value);
  return acc;
}, {});

console.log(params);

输出结果为一个包含每个参数键值对的对象：

{
  "name": "John",
  "age": "25"
}

2. 使用 URLSearchParams API

如果你的目标浏览器支持 URLSearchParams API，你可以使用它来更方便地解析查询参数。

const queryString = window.location.search;
const params = new URLSearchParams(queryString);

// 获取所有参数
for (const [key, value] of params) {
  console.log(key, value);
}

输出结果为：

name John
age 25

总结

使用 window.location.search 属性，你可以轻松获取当前页面的查询参数。这是在 JavaScript 中处理 URL 查询参数的一种常见方法。你可以使用 split() 方法或 URLSearchParams API 来解析查询参数，根据你的需求选择合适的方法。

以上就是关于 window.location.search 获取参数的介绍，希望对你有所帮助！