对前端同学来说,经常要碰到一种比较麻烦的情况,那就是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. sublime text3点击ctrl+B无法运行Python程序?

    1.打开sublime text 3 ,选择 tools-->Build System-->New Build System.... 2.将下面代码块复制进新文件中,并命名为Python. ...

  2. java基础-泛型1

    浏览以下内容前,请点击并阅读 声明 泛型的使用能使类型名称作为类或者接口定义中的参数,就像一般的参数一样,使得定义的类型通用性更强. 泛型的优势: 编译具有严格的类型检查 java编译器对于泛型代码的 ...

  3. GridView的七种数据绑定列的类型

    1.BoundField 用于显示普通文本,是默认的数据绑定列的类型,一般自动生成的列就是该类型,需要注意是DataFormatString属性,该属性可以设置显示的格式,常见格式有:{0:C} 设置 ...

  4. Hadoop生态圈

    1.Hadoop是什么? 适合大数据的分布式存储与计算平台 HDFS: Hadoop Distributed File System分布式文件系统 MapReduce:并行计算框架 解决的问题: HD ...

  5. tableview 位置发生偏移

    状况描述:1.首次进入该界面时正常 2.push了新的界面后,再返回该界面 tableview和导航栏直接出现了间隔区域 tableview为代码创建 _tableView =  [[UITableV ...

  6. HTML常用属性

    blue:蓝色  red:红色  yellow:黄色  green:绿色  white:白色 gray:灰色 /*去掉下划线*/ text-decoration: none; /*添加下划线*/ te ...

  7. php+ajax 登录注册页面

    主要是登录注册功能,前端后台验证没有什么,这个大家可以自己加上去,比如过滤啊,正则啊等 还是先放图吧 这是登录及注册界面  点击注册切换到注册界面,点击登录切换到登录界面 <!DOCTYPE h ...

  8. Unity学习疑问记录之触摸点坐标

    Vector3 pos=Camera.main.ScreenToWorldPoint(Input.GetTouch(0).position); 类似的鼠标点击Camera.main.ScreenToW ...

  9. Python 随机数生成总结

    random.uniform(a, b),返回[a,b]之间的浮点数 random.randint(a, b),返回[a,b]之间的整数 random.randrange([start], stop[ ...

  10. java基础总结——开篇

    工作三年多了,一直没时间静下心来好好总结,2016年马上就要过去了.也算是给自己在新一年的一个任务吧!总结java基础,然后再总结javaweb.纯属个人学习总结,总结过程中如有模糊的地方,望各位看官 ...