获取查询参数 - JavaScript

在 Web 开发中，我们经常需要获取 URL 中传递的查询参数，以便使用这些参数进行页面的正确渲染和功能的实现。JavaScript 提供了一种简单的方式来获取这些查询参数。

获取当前 URL 查询参数

我们通常使用 window.location.search 方法获取当前 URL 中的查询字符串。查询字符串是一个以 ? 开头并由一系列的参数名和参数值对组成的字符串。参数名和参数值是由 = 符号分隔的。

以下是一个例子：

console.log(window.location.search);
// 输出： "?name=Bob&age=30"

将查询参数转换成对象

我们可以使用 URLSearchParams 和 forEach() 方法来将查询参数转换为 JavaScript 对象。URLSearchParams 是一个新的 API，用于处理 URL 查询参数。

let params = new URLSearchParams(window.location.search);

let obj = {};

params.forEach(function(value, key) {
  // 将查询参数加入到对象中
  obj[key] = value;
});

console.log(obj);
// 输出： {name: "Bob", age: "30"}

获取单个查询参数

使用 URLSearchParams 可以非常方便地获取 URL 查询参数。

let params = new URLSearchParams(window.location.search);

console.log(params.get('name'));
// 输出： "Bob"

把对象转换成查询参数

反过来，我们可以将 JavaScript 对象转换为查询参数字符串。可以使用 URLSearchParams 的 toString() 方法。但是，如果你的代码需要支持较老版本的浏览器，你可能需要使用第三方库来将对象转换为查询参数字符串。

let obj = {name: "Bob", age: 30};

let params = new URLSearchParams(obj).toString();

console.log(params);
// 输出： "name=Bob&age=30"

以上就是获取查询参数的基本用法，希望对你有所帮助。