js分解url参数(面向对象-极简主义法应用)


Posted in Javascript onAugust 09, 2012

修改前:

<script type="text/javascript"> 
var url="www.taobao.com?key0=a&key1=b&key2=c"; 
function parseQueryString(url){ 
var str=url.split("?")[1], 
items=str.split("&"); 
var arr,name,value; 
for(var i = 0, l = items.length; i < l; i++){ 
arr=items[i].split("="); 
name= arr[0]; 
value= arr[1]; 
this[name]=value; 
} 
} 
var obj=new parseQueryString(url); 
alert(obj.key1) 
</script>

修改后:
<script type="text/javascript"> 
var url="www.taobao.com?key0=a&key1=b&key2=c"; 
var pQString={ 
createNew:function(url){ 
var str=url.split("?")[1], 
items=str.split("&"); 
var arr,name,value; 
for(var i = 0, l = items.length; i < l; i++){ 
arr=items[i].split("="); 
name= arr[0]; 
value= arr[1]; 
this[name]=value; 
} 
} 
} 
var obj=new pQString.createNew(url); 
alert(obj.key1) 
</script>

感谢 草根程序猿很厉害把这个方法重写了一下,更严密,高效了,最后面在些再学习一下!!!
<script type="text/javascript"> 
function getQueryString(url) { 
if(url) { 
url=url.substr(url.indexOf("?")+1); //字符串截取,比我之前的split()方法效率高 
} 
var result = {}, //创建一个对象,用于存name,和value 
queryString =url || location.search.substring(1), //location.search设置或返回从问号 (?) 开始的 URL(查询部分)。 
re = /([^&=]+)=([^&]*)/g, //正则,具体不会用 
m; 
while (m = re.exec(queryString)) { //exec()正则表达式的匹配,具体不会用 
result[decodeURIComponent(m[1])] = decodeURIComponent(m[2]); //使用 decodeURIComponent() 对编码后的 URI 进行解码 
} 
return result; 
} 
// demo 
var myParam = getQueryString("www.taobao.com?key0=a&key1=b&key2=c"); 
alert(myParam.key1); 
</script>

注:
1、substr()与substring(start,stop) ,提取字符串中介于两个指定下标之间的字符。
重要事项:与 slice() 和 substr() 方法不同的是,substring() 不接受负的参数。
参见https://3water.com/w3school/js/jsref_substring.htm
2、location.search.substring(1) ,location.search设置或返回从问号 (?) 开始的 URL(查询部分)。
参见https://3water.com/w3school/htmldom/prop_loc_search.htm
3、exec() 方法用于检索字符串中的正则表达式的匹配。太强大了,还不会用
参考https://3water.com/w3school/js/jsref_exec_regexp.htm
4、使用 decodeURIComponent() 对编码后的 URI 进行解码。
参见https://3water.com/w3school/js/jsref_exec_regexp.htm
Javascript 相关文章推荐
IE innerHTML,outerHTML所引起的问题
Jun 04 Javascript
Jquery iframe内部出滚动条
Feb 11 Javascript
jquery1.5.1中根据元素ID获取元素对象的代码
Apr 02 Javascript
qq悬浮代码(兼容各个浏览器)
Jan 29 Javascript
深入理解JavaScript系列(35):设计模式之迭代器模式详解
Mar 03 Javascript
JS读取XML文件数据并以table形式显示数据的方法(兼容IE与火狐)
Jun 02 Javascript
手机端实现Bootstrap简单图片轮播效果
Oct 13 Javascript
浅谈js函数中的实例对象、类对象、局部变量(局部函数)
Nov 20 Javascript
原生Javascript插件开发实践
Jan 09 Javascript
jQuery实现适用于移动端的跑马灯抽奖特效示例
Jan 18 jQuery
vue之延时刷新实例
Nov 14 Javascript
原生js实现html手机端城市列表索引选择城市
Jun 24 Javascript
深入理解javascript学习笔记(一) 编写高质量代码
Aug 09 #Javascript
JS数学函数Exp使用说明
Aug 09 #Javascript
基于jQuery实现左右div自适应高度完全相同的代码
Aug 09 #Javascript
分享精心挑选的12款优秀jQuery Ajax分页插件和教程
Aug 09 #Javascript
用JQuery在网页中实现分隔条功能的代码
Aug 09 #Javascript
基于jQuery的简单九宫格实现代码
Aug 09 #Javascript
JavaScript基础知识之数据类型
Aug 06 #Javascript
You might like
深入理解PHP原理之异常机制
2010/08/21 PHP
PHP根据IP地址获取所在城市具体实现
2013/11/27 PHP
php无限分类使用concat如何实现
2015/11/05 PHP
WordPress中编写自定义存储字段的相关PHP函数解析
2015/12/25 PHP
js网页侧边随页面滚动广告效果实现
2011/04/14 Javascript
基于jquery的web页面日期格式化插件
2011/11/15 Javascript
javascript对话框使用方法(警告框 javascript确认框 提示框)
2014/01/07 Javascript
用js的document.write输出的广告无阻塞加载的方法
2014/06/05 Javascript
jQuery焦点图切换简易插件制作过程全纪录
2014/08/27 Javascript
浅谈Javascript变量作用域问题
2014/12/16 Javascript
jQuery结合HTML5制作的爱心树表白动画
2015/02/01 Javascript
Javascript实现获取及设置光标位置的方法
2015/07/21 Javascript
JavaScript表单焦点自动切换代码
2016/07/24 Javascript
AngularJS基础 ng-paste 指令简单示例
2016/08/02 Javascript
利用imgareaselect辅助后台实现图片上传裁剪
2017/03/02 Javascript
js基于FileSaver.js 浏览器导出Excel文件的示例
2017/08/15 Javascript
laravel-admin 与 vue 结合使用实例代码详解
2019/06/04 Javascript
js常见遍历操作小结
2019/06/06 Javascript
JavaScript实现秒杀时钟倒计时
2019/09/29 Javascript
Vue解析剪切板图片并实现发送功能
2020/02/04 Javascript
JS错误处理与调试操作实例分析
2020/04/13 Javascript
Vue 基于 vuedraggable 实现选中、拖拽、排序效果
2020/05/18 Javascript
[37:50]VP vs TNC Supermajor小组赛B组 BO3 第一场 6.2
2018/06/03 DOTA
解决python文件字符串转列表时遇到空行的问题
2017/07/09 Python
解决win64 Python下安装PIL出错问题(图解)
2018/09/03 Python
浅谈在django中使用filter()(即对QuerySet操作)时踩的坑
2020/03/31 Python
python反编译教程之2048小游戏实例
2021/03/03 Python
HTML5 video标签(播放器)学习笔记(二):播放控制
2015/04/24 HTML / CSS
JAKO-O德国野酷台湾站:德国首屈一指的婴幼童用品品牌
2019/01/14 全球购物
领导干部四风问题自我剖析材料
2014/09/25 职场文书
2014年出纳工作总结与计划
2014/12/09 职场文书
客户经理岗位职责
2015/01/31 职场文书
2015年光棍节活动总结
2015/03/24 职场文书
使用pandas生成/读取csv文件的方法实例
2021/07/09 Python
SpringBoot+VUE实现数据表格的实战
2021/08/02 Java/Android
Java 垃圾回收超详细讲解记忆集和卡表
2022/04/08 Java/Android