获取 url 并解析生成包含查询串参数的对象

页面的 URL 地址可以通过 location.url 取得,举个例子,比如 https://www.example.com/path?name1=value1&name2=value2#top

这时根据 URL 中的 ?#& 特征字符,充分利用好 split() 字符串分割方法将整个 URL 逐渐剥离成以查询串参数组成的数组,最后还是使用 split() 方法根据 = 字符分割出查询串参数的 keyvalue

注意要对查询串参数进行解码(decode),因为 URL 中可能会有被编码过的特殊字符。

// 通过 location.url 属性获取 url,下面是个示例
var url = 'https://www.example.com/path?name1=value1&name2=value2#top';
function parseQueryStr (url) {
  var arr = url.split('?'),
      res = {};
  if (!arr[1]) {
    return res;
  }
  var tempArr = arr[1].split('#')[0].split('&');
  tempArr.forEach(function (item) {
    var query = item.split('=');
    res[decodeURIComponent(query[0])] = decodeURIComponent(query[1]);
  });
  return res;
}
console.log(parseQueryStr(url));    // {name1: "value1", name2: "value2"}
复制代码

转载于:https://juejin.im/post/5c83903df265da2dd0527529

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值