URL上的参数获取
new URLSearchParams(window.location.search)
是 JavaScript 中用于解析 URL 中查询参数的常用方法。它可以帮助你轻松获取和操作 URL 中的查询字符串参数。
用法
- 获取查询参数:从 URL 中获取参数的值。
- 设置或更改查询参数:对查询字符串进行修改或添加新的参数。
- 遍历查询参数:遍历 URL 中的所有查询参数。
示例
假设当前 URL 是:
https://example.com/page?name=John&age=30
1. 获取查询参数
const params = new URLSearchParams(window.location.search);
const name = params.get('name'); // "John"
const age = params.get('age'); // "30"
2. 设置或更改查询参数
params.set('name', 'Jane');
console.log(params.toString()); // "name=Jane&age=30"
3. 遍历查询参数
for (const [key, value] of params.entries()) {
console.log(`${key}: ${value}`);
}
// 输出:
// name: John
// age: 30
4. 将查询参数转换为对象
如果你希望将所有查询参数转换成对象,可以这样做:
const queryParams = Object.fromEntries(params.entries());
console.log(queryParams);
// 输出: { name: "John", age: "30" }
总结
URLSearchParams
提供了一个便捷的 API 来解析和操作 URL 中的查询字符串,让获取、修改、删除参数变得更简单。