旁观自己 善待朝夕|

猫老板的豆

园龄:9年4个月粉丝:52关注:0

js获取url中的参数值(黑科技)

以此 url 为例:http://localhost/index.html?id=310&name=xia&phone=13800138000



//获取url传递的信息
let query = location.search;  // ?id=310&name=xia&phone=13800138000

let searchParams = new URLSearchParams(query);

// 简单使用
// 只需要new一个URLSearchParams的实例即可,代码:
for (let v of searchParams) {
  console.log(v);
}
// ["id", "310"]
// ["name", "xia"]
// ["phone", "13800138000"]

// 获取单个字段
// 假如现在我只想获取单个字段的值,该怎么办呢?只需要调用这个实例的get方法即可, 代码:
searchParams.get('id') // "310"
searchParams.get('name') // "xia"
searchParams.get('phone') // "13800138000"

// 设置字段
// 有时候想重写一个字段,这时候需要使用set方法,代码:
searchParams.set('id', '123');

// 判断字段是否存在
// 使用实例的has方法进行判断,代码:
searchParams.has('id') // "310"
searchParams.has('name') // "xia"

// 添加字段
// 实例提供了append方法来添加字段,这个方法接收两个参数,前者是key,后者是value,代码:
searchParams.append('age', 26);
searchParams.has('age'); // true
searchParams.get('age'); // 26

// 删除字段
// 现在不想要phone字段了,直接使用delete即可,代码:
searchParams.delete('phone');
searchParams.has('phone'); // false

兼容性:现代浏览器基本没有啥大问题,但是IE的支持不是很理想。

在这里插入图片描述

本文作者:猫老板的豆

本文链接:https://www.cnblogs.com/bingcola/p/16499192.html

版权声明:本作品采用知识共享署名-非商业性使用-禁止演绎 2.5 中国大陆许可协议进行许可。

posted @   猫老板的豆  阅读(78)  评论(0编辑  收藏  举报
点击右上角即可分享
微信分享提示
评论
收藏
关注
推荐
深色
回顶
收起
  1. 1 404 not found REOL
404 not found - REOL
00:00 / 00:00
An audio error has occurred.