使用ES6 简单方便的从 URL 中获取指定的参数
温馨提示：
本文最后更新于 2022年12月12日，已超过 500 天没有更新。若文章内的图片失效（无法正常加载），请留言反馈或直接联系我。
ES6 提供了 URLSearchParams 对象，可以接收一个 URL 的查询字符串。
如果将 window.location.search 传入后，再通过实体的 get() 方法。
就可以简单方便地获取当前页面路径中对应参数的值。
// 假设当前页面链接为：
// https://92cxy.cn/?name=wxd&age=22&book=ceshi&book=wangxiaodong
const searchParams = new URLSearchParams(window.location.search);
console.log(searchParams.get("name"));
// wxd
console.log(searchParams.get("age"));
// 22
console.log(searchParams.getAll('book'));
// ['ceshi', 'wangxiaodong'] window.location.search 获取到的值是从 ? 开始的字符串。而URLSearchParams 会自动移除字符串起始位置的 ?。
URLSearchParams 除了可以方便地获取 URL 参数外，也能方便地修改参数。
// 假设当前页面链接为：
// https://92cxy.cn/?name=wxd&age=22&book=ceshi&book=wangxiaodong&lang=zh_CN
const searchParams = new URLSearchParams(window.location.search);
// 添加参数
searchParams.append("foo", "bar");
// 删除参数
searchParams.delete("lang");
// 输出
searchParams.toString();
// "name=wxd&age=22&book=ceshi&book=wangxiaodong&lang=zh_CN" 另外toString() 输出的内容也不会包含 ?。
正文到此结束
- 本文标签： JavaScript Html 前端
- 本文链接： http://www.92cxy.cn/article/73
- 版权声明： 本文由王小东原创发布，转载请遵循《署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0)》许可协议授权
热门推荐
相关文章
该篇文章的评论功能已被站长关闭
