JavaScript解析url参数

最近在写个需要分页数的网页,觉得要每页写对应页数的内容太麻烦,想通过向后台传入不同的参数以获取不同的数据,翻了翻书最后用url的参数传给后台,顺便写了这篇博客。

https://www.baidu.com/s?wd=123&rsv_spt=1&rsv_iqid=0x9eaca8490005e3f5&issp=1&f=3&rsv_bp=0&rsv_idx=2&ie=utf-8&tn=baiduhome_pg&rsv_enter=0&rsv_sug3=4&rsv_sug1=1&rsv_sug7=100&rsv_t=59c4B9xpYT0CtlwX3hcIK2e8B%2FQ%2BrI1G57BQtFLye7K8KSCqQksdxMmTku949CJalpC0&prefixsug=12%2526lt%253B&rsp=0&inputT=1595&rsv_sug4=1672

上面这段链接看起来很长,粘贴到网址上其实就是在百度中搜索123的页面,而这个其实就对于着?后面的wd=123,在很多网址中我们经常会看到像这样的一串内容,其实就是在?后面通过&作为分隔符传入多个参数,并通过解析这些参数在服务器获取不同数据,渲染出不同的页面,要达到这种效果,首先我们要会解析这些参数。

代码如下

// 获取url参数
function locationExtract(classify) {//传入要找的参数名
    let url=window.location.search;
    if (url == "" || url.indexOf('=') < 0)
        return;//当url后面没有参数时直接return结束
    if (url.indexOf('&') < 0) {
        if (url.slice(1).split('=')[0] == classify) {
            return url.slice(1).split('=')[1];
            //当url后面只有一个参数时没加&分隔符,此时只需判断第一个是否为自己要找的参数
        }
    }
    let par = url.slice(1).split('&');//去掉?后以&为分隔符分隔参数
    for (let index = 0; index < par.length; index++) {
        let indexClass = par[index].split('=');
        if (indexClass[0] == classify)
            return indexClass[1];
    }
}

封装以上方法后在上面的链接的控制台中输入locationExtract('wd')即可得到'123'。

这只是这次写的小demo用到的方法,应该还有很多好的方法,希望各位大神不吝赐教,也希望这篇文章对大家有所帮助。

猜你喜欢

转载自blog.csdn.net/zemprogram/article/details/83690626