对前端同学来说,经常要碰到一种比较麻烦的情况,那就是url查询字符串的解析问题。说起来也不难,就是比较麻烦。

  具体来处理这种情况的时候,相信有一部分同学就是针对具体项目中的需要的字符去正则匹配一下,业务需求嘛,解决就算了。原来我也是这样干的。不过最好还是抽一种方法出来,毕竟这种工具类的发放很多地方都会用到。当然现在github上有很多大牛的作品可以借鉴。今天自己也来实现一下。

  总体思路很简单,就是正则去匹配看是否有查询字符串的出现,不过为了功能丰富点也就是随手加上了支持自定义字符串的解析(有点鸡肋),可选返回的是数组或者对象。具体处理可以见代码:

/**
* @method queryString
* @param getObj 结果为对象否则为数组
* @default false
* @param str 需要解析的string
* @default location.search
* @return Object or Array
* */
function queryString(getObj,str){
var string = (str!== undefined) ? str : window.location.search;
var result = string.match(new RegExp("[^\?\&]+=[^\?\&]+","g"));
if(result == null){
result = '';
}else if(getObj){
var params = {};
for(var i = 0; i < result.length; i++){
var res = result[i].split('=');
var key = res[0],
value = res[1];
params[key] = value;
}
result = params;
}
return result;
}

  2、关于业务方的需求,用一句话来形容比较合适:天长地久有时尽,需求变动无绝期。可能你有时候说,后端tm不需要全部的查询字符串他只要一个或者多个,反正就不要全部的。你给我个对象还是需要处理呀,能不能一步到位暴露获取具体的某个key的值的方法。当然既然都抽出来了那就要有这个意识。

  还是先说实现,其实与上面的思路也很类似只不过就是去匹配具体值了,然后返回字符串喽 :具体见代码

 1 /**
2 * @method queryByKey 获取指定key的值
3 * @param key
4 * @default null
5 * @return string
6 * */
7 function queryByKey(key){
8 var result = location.search.match(new RegExp(key+"=[^\?\&]+","g"));
9 var value = result?result[0].split('=')[1]:'';
10 return value;
11 }

  3、此外在方法一的基础上还可以新增一个方法,根据索引来获取具体值:

1 /**
2 * @method queryByKey 获取指定index的值
3 * @param index
4 * @default null
5 * @return string
6 * */
7 function queryByIndex(index){
8 var param = queryString()[index];
9 var value = param ? param.split('=')[1] : ''
10 return value;
11 }

   一句话抛砖引玉,希望有大牛来不吝赐教。有兴趣的同学可以移步到https://github.com/xiaoxiangdaiyu/querystring-url

   参考文章:http://www.cnblogs.com/sunnycoder/archive/2010/02/28/1674998.html

querystring 解析url 查询字符串的更多相关文章

  1. 黑马旅游网 解析url查询字符串

    function getUrlParam(name) { let reg = new RegExp("(^|&)" + name + "=([^&]*)( ...

  2. 解析URL查询字符串参数为对象以及老浏览器的getElementsByClassName

    高程3使用拼接字符串形式解析的查询字符串,网上有各种正则方式解析的,记得太多,临时需要写的时候,自己都搞混乱了.只记一种吧,用正则. function getQueryStringArgs() { v ...

  3. 添加jQuery方法解析url查询部分

    Web前端不同页面间传值可以使用 cookies.localStorage 和 sessionStorage 等本地存储. 但是,今天我们尝试使用 url 查询,假设我们要传递字符串 str 到 mo ...

  4. php的URL查询字符串解析函数

    URL查询字符串格式:Data[650][BLN]=40002307312&Data[650][Status]=電聯無人接聽. 解析这种数据使用函数:parse_str(). parse_st ...

  5. JS如何获取url查询字符串的键和值?

    /** * 根据url查询字符串里的键名获取其值 */function getSearchString(key, search) { // 获取URL中?之后的字符 var str = search; ...

  6. 【hive】解析url格式字符串

    解析url格式字符串 parse_url() parse_url(url_str,’xxx’):第一个参数是url格式字符串,第二个参数为要解析出来的属性 parse_url(‘http://face ...

  7. NodeJS学习笔记 (14)URL查询字符串-querystring(ok)

    模块概述 在nodejs中,提供了querystring这个模块,用来做url查询参数的解析,使用非常简单. 模块总共有四个方法,绝大部分时,我们只会用到 .parse(). **.stringify ...

  8. js获取url查询字符串参数

    最近看js高级程序设计 对其中查询字符串参数的获得重新写了,当传递一个完整的URL的时候对查询字符串的提取 function getQueryArgs(){ var qs = (location.se ...

  9. 函数parseQuery用于解析url查询参数

    在百度上找的,以后忘了再看. 语法如下: var obj = parseQuery(query) query是被解析的查询参数,函数返回解析后的对象. 使用范例如下: var jerry = pars ...

随机推荐

  1. matlab学习第一天

    >> x=linspace(-,,); >> y=x.^.*sin(x); >> plot(x,y,) >> plot(x,y,) 分析: linspa ...

  2. EF中执行sql语句,以及事务

    EF to sql string sql = "select T_Task.BSID,T_Task.CloseDate,T_Task.CompleteDate,T_Task.CloseUse ...

  3. POJ 2431Expedition

    Description A group of cows grabbed a truck and ventured on an expedition deep into the jungle. Bein ...

  4. JS里面的两种运动函数

    最新学了一个新的运动函数,与最初学习的有所不同,第一个运动是根据运动速度完成运动 ,第二个则是根据运动的时间来完成运动,而且把之前的函数都进行了一些兼容处理,在这里列出了看一下: 第一种animate ...

  5. NOI 题库 6264

    6264  走出迷宫 描述 当你站在一个迷宫里的时候,往往会被错综复杂的道路弄得失去方向感,如果你能得到迷宫地图,事情就会变得非常简单. 假设你已经得到了一个n*m的迷宫的图纸,请你找出从起点到出口的 ...

  6. poj2104 K-th Number区间第k小值 主席树

    原来主席树就是可持久化线段树啊,刚知道,,, 作为一道裸题,还是必A的,然而一开始偷懒不写离散化跪了N多遍,后来在缪大的帮助下发现了这个问题,遂A之 ——又是这种破问题,实在不想说自己了 把n个数看成 ...

  7. Python中的list和tuple

      list使用方括号[ ]表示: >>> classmates = ['Michael', 'Bob', 'Tracy'] >>> classmates ['Mi ...

  8. ActiveMQ集群应用

    ActiveMQ集群 ActiveMQ具有强大和灵活的集群功能,但在使用的过程中会发现很多的缺点,ActiveMQ的集群方式主要由两种:Master-Slave和Broker Cluster. 1.M ...

  9. 谢欣伦 - OpenDev原创教程 - 无连接套接字类CxUdpSocket

    这是一个精练的无连接套接字类,类名.函数名和变量名均采用匈牙利命名法.小写的x代表我的姓氏首字母(谢欣伦),个人习惯而已,如有雷同,纯属巧合. CxUdpSocket的使用如下(以某个叫做CSomeC ...

  10. 一道无限级分类题的 PHP 实现

    今天有网友出了道题: 给出如下的父子结构(你可以用你所用语言的类似结构来描述,第一列是父,第二列是子),将其梳理成类似如图的层次父子结构. origin = [('A112', 'A1122'), ( ...