目录


 

正文


​​回到顶部​​


 1、方式一：通过字符串截取的方式获取参数值；

函数一：获取URL中的参数名及参数值的集合



js获取url参数值的方法总结_获取参数

1 /**
 2  * [获取URL中的参数名及参数值的集合]
 3  * 示例URL:http://htmlJsTest/getrequest.html?uid=admin&rid=1&fid=2&name=小明
 4  * @param {[string]} urlStr [当该参数不为空的时候，则解析该url中的参数集合]
 5  * @return {[string]}       [参数集合]
 6  */
 7 function GetRequest(urlStr) {
 8     if (typeof urlStr == "undefined") {
 9         var url = decodeURI(location.search); //获取url中"?"符后的字符串
10     } else {
11         var url = "?" + urlStr.split("?")[1];
12     }
13     var theRequest = new Object();
14     if (url.indexOf("?") != -1) {
15         var str = url.substr(1);
16         strs = str.split("&");
17         for (var i = 0; i < strs.length; i++) {
18             theRequest[strs[i].split("=")[0]] = decodeURI(strs[i].split("=")[1]);
19         }
20     }
21     return theRequest;
22 }


js获取url参数值的方法总结_i++_02



1 var parms_1 = GetRequest();
2 console.log(parms_1); // {"uid":"admin","rid":"1","fid":"2","name":"小明"}
3 console.log(parms_1['name']); // '小明'
4 var parms_2 = GetRequest('http://htmlJsTest/getrequest.html?uid=admin&rid=1&fid=2&name=小明');
5 console.log(parms_2); // {"uid":"admin","rid":"1","fid":"2","name":"小明"}
6 console.log(parms_2['name']); // '小明'


函数二：URLSearchParams()函数



var url2 = 'https://gitbook.cn/gitchat/geekbooks?tag=%E5%A4%A7%E6%95%B0%E6%8D%AE&name=gy&age=22';
        var temp2 = url2.split('?')[1];
        var pram2 = new URLSearchParams('?'+temp2);
        console.log(pram2.get('tag')); // 大数据
        console.log(pram2.get('name'));// gy
        console.log(pram2.get('age')); // 22
        console.log(temp2);   //tag=%E5%A4%A7%E6%95%B0%E6%8D%AE&name=gy&age=22


 

函数三：通过window.location.search对象，根据参数名获取url中的参数值



js获取url参数值的方法总结_字符串截取_03

1 /**
 2  * [通过参数名获取url中的参数值]
 3  * 示例URL:http://htmlJsTest/getrequest.html?uid=admin&rid=1&fid=2&name=小明
 4  * @param  {[string]} queryName [参数名]
 5  * @return {[string]}           [参数值]
 6  */
 7 function GetQueryValue(queryName) {
 8     var query = decodeURI(window.location.search.substring(1));
 9     var vars = query.split("&");
10     for (var i = 0; i < vars.length; i++) {
11         var pair = vars[i].split("=");
12         if (pair[0] == queryName) { return pair[1]; }
13     }
14     return null;
15 }


js获取url参数值的方法总结_i++_04



1 var queryVal=GetQueryValue('name');
2 console.log(queryVal);// 小明


 



​​回到顶部​​


2、方式二：通过正则获取到参数值；



js获取url参数值的方法总结_获取参数_05

1 /**
 2  * [通过参数名获取url中的参数值]
 3  * 示例URL:http://htmlJsTest/getrequest.html?uid=admin&rid=1&fid=2&name=小明
 4  * @param  {[string]} queryName [参数名]
 5  * @return {[string]}           [参数值]
 6  */
 7 function GetQueryValue1(queryName) {
 8     var reg = new RegExp("(^|&)" + queryName + "=([^&]*)(&|$)", "i");
 9     var r = window.location.search.substr(1).match(reg);
10     if ( r != null ){
11        return decodeURI(r[2]);
12     }else{
13        return null;
14     }
15  }


js获取url参数值的方法总结_获取参数_06



1 var queryVal=GetQueryValue1('name');
2 console.log(queryVal);// 小明


 


 

出处：​​javascript:void(0)​​



目录


 

正文


​​回到顶部​​


 1、方式一：通过字符串截取的方式获取参数值；

函数一：获取URL中的参数名及参数值的集合



js获取url参数值的方法总结_获取参数_07

1 /**
 2  * [获取URL中的参数名及参数值的集合]
 3  * 示例URL:http://htmlJsTest/getrequest.html?uid=admin&rid=1&fid=2&name=小明
 4  * @param {[string]} urlStr [当该参数不为空的时候，则解析该url中的参数集合]
 5  * @return {[string]}       [参数集合]
 6  */
 7 function GetRequest(urlStr) {
 8     if (typeof urlStr == "undefined") {
 9         var url = decodeURI(location.search); //获取url中"?"符后的字符串
10     } else {
11         var url = "?" + urlStr.split("?")[1];
12     }
13     var theRequest = new Object();
14     if (url.indexOf("?") != -1) {
15         var str = url.substr(1);
16         strs = str.split("&");
17         for (var i = 0; i < strs.length; i++) {
18             theRequest[strs[i].split("=")[0]] = decodeURI(strs[i].split("=")[1]);
19         }
20     }
21     return theRequest;
22 }


js获取url参数值的方法总结_i++_08



1 var parms_1 = GetRequest();
2 console.log(parms_1); // {"uid":"admin","rid":"1","fid":"2","name":"小明"}
3 console.log(parms_1['name']); // '小明'
4 var parms_2 = GetRequest('http://htmlJsTest/getrequest.html?uid=admin&rid=1&fid=2&name=小明');
5 console.log(parms_2); // {"uid":"admin","rid":"1","fid":"2","name":"小明"}
6 console.log(parms_2['name']); // '小明'


函数二：URLSearchParams()函数



var url2 = 'https://gitbook.cn/gitchat/geekbooks?tag=%E5%A4%A7%E6%95%B0%E6%8D%AE&name=gy&age=22';
        var temp2 = url2.split('?')[1];
        var pram2 = new URLSearchParams('?'+temp2);
        console.log(pram2.get('tag')); // 大数据
        console.log(pram2.get('name'));// gy
        console.log(pram2.get('age')); // 22
        console.log(temp2);   //tag=%E5%A4%A7%E6%95%B0%E6%8D%AE&name=gy&age=22


 

函数三：通过window.location.search对象，根据参数名获取url中的参数值



js获取url参数值的方法总结_字符串截取_09

1 /**
 2  * [通过参数名获取url中的参数值]
 3  * 示例URL:http://htmlJsTest/getrequest.html?uid=admin&rid=1&fid=2&name=小明
 4  * @param  {[string]} queryName [参数名]
 5  * @return {[string]}           [参数值]
 6  */
 7 function GetQueryValue(queryName) {
 8     var query = decodeURI(window.location.search.substring(1));
 9     var vars = query.split("&");
10     for (var i = 0; i < vars.length; i++) {
11         var pair = vars[i].split("=");
12         if (pair[0] == queryName) { return pair[1]; }
13     }
14     return null;
15 }


js获取url参数值的方法总结_i++_10



1 var queryVal=GetQueryValue('name');
2 console.log(queryVal);// 小明