获取Url地址中参数的几种方法

获取Url的代码如下:window.location.href;

window.location.search是获取url中“?”以及“?”之后的字符串,在方法四中可以用到;

方法一:原生js(假设已经获得了Url地址)

var url = 'https://gitbook.cn/gitchat/geekbooks?tag=JavaScript&name=pwwu&age=24';
        var temp1 = url.split('?');
        var pram = temp1[1];
        var keyValue = pram.split('&');
        var obj = {};
        for (var i = 0; i<keyValue.length; i++){
            var item = keyValue[i].split('=');
            var key = item[0];
            var value = item[1];
            obj[key] = value;
        }
        console.log(url);
        console.log(temp1);    //  ['https://gitbook.cn/gitchat/geekbooks','tag=JavaScript&name=pwwu&age=24']
        console.log(pram);     //  tag=JavaScript&name=pwwu&age=24
        console.log(keyValue); //  ['tag=JavaScript','name=pwwu','age=24']
        console.log(obj);      //  {tag:'JavaScript',name:'pwwu',age:'24'}

总结:主要思路就是将Url用split()分割成不同的块,返回值为一个数组,一直分割到为 [‘tag=JavaScript’,‘name=pwwu’,‘age=24’]为止,
然后将该数组中的每一项以键值对的形式传进一个空对象obj(这里需要遍历数组),最后利用obj.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

方法三 使用正则表达式

//获取url中的参数方法
        function getUrlParam(name) {
            //构造一个含有目标参数的正则表达式对象
            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
            //匹配目标参数
            var r = window.location.search.substr(1).match(reg);
            //返回参数
            if (r != null) {
                return unescape(r[2]);
            } else {
                return null;
            }
        }
        var ABC = getUrlParam();
        console.log(ABC);


后续还有其他方法,暂时记得这么多,想起来再回头补。。。

方法四 2020-01-13更新

var url = location.search;//获取当前浏览器url路径(“?”以及“?”之后的字符串)
 //?name=wpw&id=123&age=26
    var theRequest = new Object();
    var str = url.substr(1);//name=wpw&id=123&age=26

    var listData = [];

    strs = str.split("&");
    for (var z = 0; z < strs.length; z++) {
        theRequest[strs[z].split("=")[0]] = (strs[z].split("=")[1]);
    }
    console.dir(theRequest);//["name=wpw", "id=123", "age=26"]
    //最后url里面所有的参数都被theRequest对象以键值对的形式呈现出来
©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页