URL地址 问号传参解析

一、什么是URL参数？

URL 参数是追加到 URL 上的一个名称/值对。参数以问号 (?) 开始并采用 name=value 的格式。如果存在多个 URL 参数，则参数之间用一个 (&) 符隔开。
有时还会有 #

二、为什么需要解析url的参数？

面试问过

三、如何解析url地址的参数

主要知识点字符串的处理

1. 找到？的下标，找到 # 的下标 IndexOf()
   #号 可能不存在，直接截取问号到最后substr()
   #号存在，截取问号下一位到#号前一位substring()

   此时结果：from=search&seid=7866238583240312286

2. 根据&再分割 split()

   此时结果： [“from=search”, “seid=7866238583240312286”]

3. 遍历数组，根据=分割后再依次存储！

   每个item: [“from”, “search”] [“seid”, “7866238583240312286”]

   最终：{from: “search”, seid: “7866238583240312286”}

let str = "https://www.bilibili.com/video/BV1zz4y1k7jX?from=search&seid=7866238583240312286";
let str2 = "https://www.nowcoder.com/sns/message/262713506/conversation-list?#/";

function getUrl(url) {
     
   let indexAsk = url.indexOf('?'),
       indexWell = url.indexOf('#');
   if (indexWell == -1) {
     
       // 没有井号 ？开始直接截取到最后
       url = url.substr(indexAsk + 1);
   } else {
     
       url = url.substring(indexAsk + 1, indexWell);
   }
   // 根据& 拆分
   let array = url.split('&');
   let obj = {
     };
   for (let i = 0; i < array.length; i++) {
     
       let item = array[i].split('=');
       obj[item[0]] = item[1];
   }
   return obj;
}

console.log(getUrl(str));
console.log(getUrl(str2));

获取表单的url

let url2 = window.location.search.substring(1);