location.serach查询字符串参数

108 2

location.serach获取到链接地址中?后包括?的内容!

此时,假设我们的地址是:https://www.mulingyuer.com/测试/?id=5&search=ok

通过location.serach可以获得?id=5&search=ok这部分内容,如果我要分别拿到里面对应的内容,就需要使用字符操作了。

首先,?问好是第一个要被排除的对象,我们可以利用slice、substring、substr三个区域选择符进行操作。

  • slice,好处是负数是通过总字符数+负数得到需要的区域!
  • substring,好处是:当只有一个负数的时候,不裁剪区域,全出输出,当其中一个数为负数的时候,默认识别为0,并且如果后面的数字小于前面的数字,会进行前后调换,如(2,-1)=(2,0)=(0,2)!
  • substr,好处是:当只有一个数且为负数,和slice一样,当两个数中其中一个为负数时,负数识别为0,但是不会像substring一样小的数字调换到前面,如(5,-2)=(5,0)

在这个例子中,我们只是需要去掉?而已,所以,三个哪个都很合适,我们随便来一个:

location.search.slice(1);  得到:id=5&search=ok  字符串;

其中我们还需要将它拆解为id=5,search=ok,这里又用到了查找替换并返回数组的split,于是我们加工下!

var box = window.location.search.slice(1);
var box2 = box.split('&');
alert(box2);          得到id=5,search=ok

这样还不行,我们最终的效果是直接输出id得到值和serach得到值,为此我们还需要将id=和serach=进行分解,我们可以利用重复语句分别得到box2[0]和box2[1],然后再对其进行查找替换返回数组,在通过分别调用数组中的下标来返回得到的值。

var box = window.location.search.slice(1);
var box2 = box.split('&');
var box3 = null;
for(var i = 0;i<box2.length;i++) {
   box3 = box2[i].split('=');
   alert(box3);
};

利用一个box3来临时保存得到的数组,此时已经可以输出 id,5 search,ok 这个时候,我们还需要使用数组来保存这个数据,并且对其进行封包处理。

数组的时候,曾经说过,数组的下标是可以使用字符串来命名的,但是调用的时候需要使用引号['字符串']来调用,并且在直接调用数组的时候,是没有值的,只能通过下标['字符串']才有值显示。

function box5() {
  var box = location.search.length > 0 ? location.search.slice(1) : '';
  var box2 = box.split('&');
  var box3 = null,box4 = [],name = null,value = null;
  for(var i = 0;i<box2.length;i++) {
     box3 = box2[i].split('=');
     name = box3[0];
     value = box3[1];
     box4[name] = value;
  };
  return box4;
};

var box6 = box5();
alert(box6['id'] + '|' + box6['search']);

创建变量name用来存储id和search,value用来存储5和ok,然后利用数组的下标可以使用字符的特性,将name直接传到下标中,然后在等于value值,这样一串代码,就可以创建两个数组了,最后,由于使用了封包,函数下创建的变量外边无法直接访问,于是我们return出这个box4.

为了方便点,我么新建了一个变量box6来运行函数,然后在box6['字符串']来调用对应的值,这样就可以了,值都单独拿出来了,你想怎么写就看自己的想法了是吧!

0

相关文章

微信收款码
微信收款码