location对象查询字符串参数

Posted 光炎

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了location对象查询字符串参数相关的知识,希望对你有一定的参考价值。

虽然location.search可以返回从问号到URL末尾的所有内容,但却没有办法逐个访问其中的每个查询字符串参数。为此,可以创建下面这样一个函数,用以解析查询字符串,然后返回包含所有参数的一个对象:

 1 function getQueryStringArgs(){
 2     //取得查询字符串并去掉开头的问号
 3     var qs = (location.search.length > 0 ? location.search.substring(1) : "");
 4     //保存数据的对象
 5     var args = [];
 6     //取得每一项
 7     var items = qs.length ? qs.split("&") : [];
 8     var item = null;
 9     var name = null;
10     var value = null;
11     //逐个将每一项添加到args对象中
12     for(var i=0;i< items.length;i++){
13         item = items[i].split("=");
14         name = decodeURIComponent(item[0]);
15         value = decodeURIComponent(item[1]);
16         if(name.length){
17             args[name] = value;
18         }
19     }
20     return args;
21 }
22 
23 //假设查询的字符串是?q=javascript&num=10
24     var args = getQueryStringArgs();
25     alert(args["q"]);//javascript
26     alert(args["num"]);//10

这个函数的第一步是先去掉查询字符串开头的问号,前提是location.search中必须要包含一个或多个字符。然后将所有参数保存在args对象中,该对象以字面量形式创建。接下来根据和号(&)来分割查询字符串,并返回name=value格式的字符串数组。然后for循环会迭代这个数组,再根据等于号分割每一项,从而返回第一项为参数名,第二项为参数值的数组。再使用decodeComponent()分别解码name和value(因为查询字符串应该是被编码过的),最后将name作为args对象的属性,将value作为相应属性的值。最后调用函数,每个查询字符串参数都成了返回对象的属性,方便了对每个参数的访问。

以上是关于location对象查询字符串参数的主要内容,如果未能解决你的问题,请参考以下文章

解析 location.search 对象以查找查询参数

url中的查询字符串的参数解析

JS获取URL的参数

逐个访问URL的每个查询字符串参数

将url的查询参数解析成字典对象

Location对象的查询字符方法实现