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

修改前:

复制代码 代码如下:

<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() 不接受负的参数。
参见http://www.jb51.net/w3school/js/jsref_substring.htm
2、location.search.substring(1) ,location.search设置或返回从问号 (?) 开始的 URL(查询部分)。
参见http://www.jb51.net/w3school/htmldom/prop_loc_search.htm
3、exec() 方法用于检索字符串中的正则表达式的匹配。太强大了,还不会用
参考http://www.jb51.net/w3school/js/jsref_exec_regexp.htm
4、使用 decodeURIComponent() 对编码后的 URI 进行解码。
参见http://www.jb51.net/w3school/js/jsref_exec_regexp.htm

时间: 2024-09-13 10:53:48

js分解url参数(面向对象-极简主义法应用)_javascript技巧的相关文章

JavaScript面向对象(极简主义法minimalist approach)_js面向对象

极简主义法 荷兰程序员 Gabor de Mooij 提出了一种比 Object.create ()更好的新方法,他称这种方法为"极简主义法"(minimalist approach).这也是我推荐的方法. 3. 1 封装 这种方法不使用 this 和 prototype,代码部署起来非常简单,这大概也是它被叫做"极简主义法"的原因. 首先,它也是用一个对象模拟"类".在这个类里面,定义一个构造函数 createNew (),用来生成实例. 复制

Javascript 获取链接(url)参数的方法[正则与截取字符串]_javascript技巧

当然,我们也可以用正则直接匹配,文章中也给出了一个正则的例子. 分解链接的方式: 复制代码 代码如下: <script type="text/javascript"> <!-- // 说明:Javascript 获取链接(url)参数的方法 function getQueryString(name) { // 如果链接没有参数,或者链接中不存在我们要获取的参数,直接返回空 if(location.href.indexOf("?")==-1 || l

js 绑定带参数的事件以及手动触发事件_javascript技巧

1.html代码 复制代码 代码如下: <div> <div id="tab"> <h2>标题一</h2> <h2>标题二</h2> <h2>标题三</h2> <h2>标题四</h2> div> <dl id="tabcon"> <dd>内容一</dd> <dd>内容二</dd> &

js 页面传参数时 参数值含特殊字符的问题_javascript技巧

工作中遇到的小问题,一个页面中通过window.showModel("comm/morelanguage.jsp?str=zh_CN:爱#;zh_TW:愛;en:love;",,,,);弹出另一个页面并将参数传递到另一个页面,另一个页面接受得到src参数值时会出现问题,值不对,测试过是因为#特殊字符的问题,对于这些特殊字符我采取的办法是 传参数时,str=escape('str=zh_CN:爱#;zh_TW:愛;en:love;')处理 接受参数时,拿到str后str=unescape

prototype教程:使用JS接受URL参数的代码

初学prototype,发个JS接受URL参数的代码以下是HTML网页特效代码,点击运行按钮可查看效果: [Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]

WEBJX收集清新美丽的极简主义风格网站设计实例

文章描述:40个清新美丽的极简主义风格网站. 如果一个页面有太多的元素,浏览者将迷惑于去看哪里或误解每个元素的优先级,而一个极简主义设计将焦点正好放到正确的内容上.越来越多的网站喜欢采用简单的风格来设计自己的页面,但想要做到理想的极简主义风格并非想象中这么容易,这里就列出了40个清新美丽的极简主义风格网站,以供设计者参考借鉴. 1. Co:collective 2. Couch Creative 3. Upperdog 4. Skinny Ships 5. Decorated Playlists

研究极简主义设计:简化您的设计

文章描述:[译]简约主义设计:少就是多. 本文翻译自老外的一篇文章(原文),但并不是完全的直译,文章中加入了我的一些经验与想法: 作为设计师的我们,都知道一个简约的设计可以创造出很美观的结果.然而,在真正去做的时候许多设计师都会遇到麻烦,在用相当少的元素去设计一个页面时,感觉相当的困难,结果都会觉得这个页面看上去像没完成的.网上有许多关于极简主义设计的文章可以去帮助你去实现效果,但却不是仅有的办法.现在,我会举一些关于极简主义设计的例子,大家可以去分析为什么有些能起作用有些却不能. 什么是简约的

极简主义网站设计:白色极简主义网站设计

文章描述:国外35个极简主义网站设计. 原文:国外35个极简主义网站设计译自:35 Effective Examples of Minimalism in Web Design请尊重版权,转载请注明来源,多谢! 极简主义的网站设计是我的最爱,之前网页教学网也有分享过很多极简主义的网站设计,这里是一批由speckyboy.com收集的另一批很赞的极简主义网站设计,供大家参考吧-- 白色极简主义网站设计 Idea Exhibit Yuna Kim Astronaut Deutsche & Japan

极简主义设计:不错的html电子名片设计

html的电子名片是一种包含着精确信息的极简主义设计,它包含的内容(大多数情况下)只有作品集,社会化连接和联系方式.这种类型的网站大都是针对于个人的.下面,我们收集了15个非常不错的html电子名片设计,点击图片可以进入到原始站点. Tim van Damme Rogie King Jan van Lysebettens Mike Jolley Lji Jinaraj