自己动手封装一个url参数解释器( ghostWuUrlParser.js )
2017-09-19 09:51
531 查看
ghostWuUrlParser.js的作用是分析一段url中的查询参数,即: '?'号后面的 键值对参数.
ghostWuUrlParser.js 使用说明:
ghostWuUrlParser( 'https://www.baidu.com/s?wd=ghostwu&name=ghost&age=22&sex=man&name=zhangsan&name=lisi' )
解释出来的结果是:
{wd: "ghostwu", name: Array(3), age: "22", sex: "man"}
Array(3) = [ 'ghost', 'zhangsan', 'lisi' ]
ghostWuUrlParser( 'https://www.baidu.com/s?wd=ghostwu&name=ghost&age=22&sex=man&name=zhangsan' )
解释出来的结果是:
{wd: "ghostwu", name: Array(2), age: "22", sex: "man"}
ghostWuUrlParser( 'https://www.baidu.com/s?wd=ghostwu&name=ghost&age=22&sex=man' )
解释出来的结果是:
{wd: "ghostwu", name: "ghost", age: "22", sex: "man"}
ghostWuUrlParser( 'https://www.baidu.com/s?wd=ghostwu&name=ghost&age=22&sex=man', 'wd' )
解释出来的结果是: ghostwu
只要对字符串处理函数比较熟练,基本很容易看懂
源代码与注解:
ghostWuUrlParser.js 使用说明:
ghostWuUrlParser( 'https://www.baidu.com/s?wd=ghostwu&name=ghost&age=22&sex=man&name=zhangsan&name=lisi' )
解释出来的结果是:
{wd: "ghostwu", name: Array(3), age: "22", sex: "man"}
Array(3) = [ 'ghost', 'zhangsan', 'lisi' ]
ghostWuUrlParser( 'https://www.baidu.com/s?wd=ghostwu&name=ghost&age=22&sex=man&name=zhangsan' )
解释出来的结果是:
{wd: "ghostwu", name: Array(2), age: "22", sex: "man"}
ghostWuUrlParser( 'https://www.baidu.com/s?wd=ghostwu&name=ghost&age=22&sex=man' )
解释出来的结果是:
{wd: "ghostwu", name: "ghost", age: "22", sex: "man"}
ghostWuUrlParser( 'https://www.baidu.com/s?wd=ghostwu&name=ghost&age=22&sex=man', 'wd' )
解释出来的结果是: ghostwu
只要对字符串处理函数比较熟练,基本很容易看懂
源代码与注解:
;(function( window, undefined ){ var ghostWuUrlParser = function( url, key ){ var res = {}; if( typeof url === 'undefined' ) { throw new Error( '请输入有效的url' ); } //p:查询 '?'号是否存在 var _url = url, p = _url.search( /\?/ ); //_url: 根据p的查询结果 把问号后面的内容赋值给_url ( p != -1 ) && ( _url = _url.slice( p + 1 ) ); var q = _url.split( '&' ); for( var i = 0, len = q.length; i < len; i++ ){ var str = q[i], pos = str.search( '=' ), //k: 参数的键 k = str.substring( 0, pos != -1 ? pos : str ), //v: 参数的值 v = str.substring( pos != -1 ? ( pos + 1 ) : str ); v && ( v = decodeURIComponent( v ) ); if( res.hasOwnProperty( k ) ){ //如果出现同名的key, 且不是数组,就把当前的值 跟之前的值 合并到一个数组 if( !( res[k] instanceof Array ) ){ res[k] = [ res[k], v ]; }else { //第三次同名的key 就执行这段 res[k].push( v ); } }else { //第一次不存在的时候,直接存 k && (res[k] = v); } } //传递了key 就提取对应的key, 否则返回完整结果 return key ? res[key] : res; } //暴露接口 window.ghostWuUrlParser = ghostWuUrlParser; })( window, undefined );
相关文章推荐
- 自己动手封装一个url参数解释器( ghostWuUrlParser.js )
- js获取上一个页面传来的URL参数
- 一个简单的js获取url参数的函数
- js获取上一个页面传来的URL参数
- 自己动手写一个 iOS 网络请求库(NSURLSession 初探、封装接口、降低耦合、快速文件上传 )
- 仿照jquery封装一个自己的js库(一)
- JS组件系列——自己动手封装bootstrap-treegrid组件
- JS +XML +Jquery 实现三级联动菜单,自己封装的一个对象方便使用
- 自己封装一个js的StringBuffer类
- Js把URL中的参数解析为一个对象
- JS组件系列——自己动手封装bootstrap-treegrid组件
- js 一个页面获取另外一个页面url传过来的参数
- 仿照jquery封装一个自己的js库(二)
- 一个关于传参数js数组的封装方法(寄生模式)
- js获取src请求 得到一个参数和多个参数写法(这是集中网上的多个方法,自己cv过去就可以使用)
- JS组件系列——自己动手封装bootstrap-treegrid组件
- 自己动手封装js工具类(JS中定义类的几种方式:混合的构造函数/原型方式,动态原型等)
- 有这样一个URL:http://item.taobao.com/item.htm?a=1&b=2&c=&d=xxx&e,请写一段JS程序提取URL中的各个GET参数(参数名和参数个数不确定),将其按k
- 自己动手写一个 iOS 网络请求库(二)——封装接口
- 自己封装的一个原生JS拖动方法(推荐)