JavaScript URL参数读取改进版


Posted in Javascript onJanuary 16, 2009

下面是三水点靠木一直也在用的几种方法

<script language="javascript" type="text/javascript"> 
function request(paras){ 
var url = location.href; 
var paraString = url.substring(url.indexOf("?")+1,url.length).split("&"); 
var paraObj = {} 
for (i=0; j=paraString[i]; i++){ 
paraObj[j.substring(0,j.indexOf("=")).toLowerCase()] = j.substring(j.indexOf("=")+1,j.length); 
} 
var returnValue = paraObj[paras.toLowerCase()]; 
if(typeof(returnValue)=="undefined"){ 
return ""; 
}else{ 
return returnValue; 
} 
} 
//下面是应用代码 
var theurl 
theurl=request("url"); 
if (theurl!=''){ 
location=theurl 
} 
</script>

下面是正则函数
用Javascript正则实现url链接的解析类
https://3water.com/article/15000.htm

下面的代码有点乱
/* 《JavaScript权威指南》介绍的更简洁的取 URL 参数的方法,不用正则表达式,用一次循环。一次性返回一个对象的好处是只需要调用一次此函数,参数和值对可以存在一个对象里,以后再取其它参数的值就不用再调用此函数了,只要取对象的属性就行了。

* 用法: 
* var args = getArgs( ); // 从 URL 解析出参数 
* var q = args.q || ""; // 如果定义了某参数,则使用其值,否则给它一个默认值 
* var n = args.n ? parseInt(args.n) : 10; 
*/ 
var getArgs = function () 
{ 
var args = new Object( ); //声明一个空对象 
var query = window.location.search.substring(1); // 取查询字符串,如从 http://www.snowpeak.org/testjs.htm?a1=v1&a2=&a3=v3#anchor 中截出 a1=v1&a2=&a3=v3。 
var pairs = query.split("&"); // 以 & 符分开成数组 
for(var i = 0; i < pairs.length; i++) { 
var pos = pairs[i].indexOf('='); // 查找 "name=value" 对 
if (pos == -1) continue; // 若不成对,则跳出循环继续下一对 
var argname = pairs[i].substring(0,pos); // 取参数名 
var value = pairs[i].substring(pos+1); // 取参数值 
value = decodeURIComponent(value); // 若需要,则解码 
args[argname] = value; // 存成对象的一个属性 
} 
return args; // 返回此对象 
}

它的突出优点就是程序只用执行一次提取操作,以后再重复取参数值,都不用再执行程序了。取 URL 参数还是这样比较简便易行,又好理解。

下面是我此前发表的“不用循环”但“有些太复杂”的版本:

//不用循环纯用正则实现从 URL 中取参数的值。取代循环的核心技术是字符串的 replace() 方法可以用函数作第二参数,按用户定义的方式去替换。 
//若有此参数名但无值,则返回空字符串;若无此参数名,返回 undefined。 
var getArg = function(argname) 
{ 
var str = location.href; 
var submatch; 
//先从 URL 中取出问号和井口与之间的查询字符串,如从 http://www.snowpeak.org/testjs.htm?a1=v1&a2=&a3=v3#anchor 中截出 a1=v1&a2=&a3=v3。 
//问号是模式的特殊字符,所以要写成 \?;井号可有可无,所以模式结尾是 #? 
if (submatch = str.match(/\?([^#]*)#?/)) 
{ 
//取到捕捉的子匹配形如 a1=v1&a2=&a3=v3,在前面加个 & 做成规则的 &a1=v1&a2=&a3=v3 便于下一步替换 
var argstr = '&'+submatch[1]; 
//做个替换用的函数,把找到的每组形如 &a1=v1 替换成 a1:"v1", 这样的对象定义用的属性声明 
var returnPattern = function(str) 
{ 
//$1 和 $2 代表捕捉到的第1个和第2个子匹配,必须用在字符串里 
return str.replace(/&([^=]+)=([^&]*)/, '$1:"$2",'); 
} 
//执行一个全局的正则替换,第二参数就是刚才定义的替换函数,把 a1=v1&a2=&a3=v3 替换成 a1:"v1",a2:"",a3:"v3", 
argstr = argstr.replace(/&([^=]+)=([^&]*)/g, returnPattern); 
//最后再执行一个对象的声明,需要形如 var retvalue = {a1:"v1",a2:"",a3:"v3"}; 的对象声明,而刚才替换完的字符串结尾还有个逗号,把结尾的逗号用 substr 截掉即可 
eval('var retvalue = {'+argstr.substr(0, argstr.length-1)+'};'); 
//现在就得到了一个对象,URL 中每个参数名是其属性名,参数值是对应的属性值 
return retvalue[argname]; 
} 
} //测试 
document.write('a1='+getArg('a1')+', a2='+getArg('a2')+', a3='+getArg('a3'));
Javascript 相关文章推荐
jquery 卷帘效果实现代码(不同方向)
Feb 05 Javascript
用Javascript获取页面元素的具体位置
Dec 09 Javascript
JS修改iframe页面背景颜色的方法
Apr 01 Javascript
jQuery.extend 函数及用法详细
Sep 06 Javascript
jquery取消事件冒泡的三种方法(推荐)
May 28 Javascript
JS中关于正则的巧妙操作
Aug 31 Javascript
解决低版本的浏览器不支持es6的import问题
Mar 09 Javascript
Vue封装的可编辑表格插件方法
Aug 28 Javascript
如何在JavaScript中谨慎使用代码注释
Jun 21 Javascript
利用JS如何获取form表单数据
Dec 19 Javascript
js实现点击生成随机div
Jan 16 Javascript
vue3.0自定义指令(drectives)知识点总结
Dec 27 Vue.js
JavaScript 在线压缩和格式化收藏
Jan 16 #Javascript
解javascript 混淆加密收藏
Jan 16 #Javascript
js 浮动层菜单收藏
Jan 16 #Javascript
jquery中常用的SET和GET
Jan 13 #Javascript
JavaScript 私有成员分析
Jan 13 #Javascript
js利用Array.splice实现Array的insert/remove
Jan 13 #Javascript
JavaScript delete操作符应用实例
Jan 13 #Javascript
You might like
php对二维数组进行排序的简单实例
2013/12/19 PHP
php使用类继承解决代码重复的问题
2015/02/11 PHP
PHP使用正则表达式实现过滤非法字符串功能示例
2018/06/04 PHP
PHP集成环境XAMPP的安装与配置
2018/11/13 PHP
如何在centos8自定义目录安装php7.3
2019/11/28 PHP
原生js的弹出层且其内的窗口居中
2014/05/14 Javascript
javascript实现浏览器窗口传递参数的方法
2014/09/03 Javascript
JavaScript的Polymer框架中dom-repeat与VM的相关操作
2015/07/29 Javascript
使用js复制链接中的部分文字的方法
2015/07/30 Javascript
如何使用jquery修改css中带有!important的样式属性
2016/04/28 Javascript
javascript url几种编码方式详解
2016/06/06 Javascript
移动端翻页插件dropload.js(支持Zepto和jQuery)
2016/07/27 Javascript
jQuery Easyui DataGrid点击某个单元格即进入编辑状态焦点移开后保存数据
2016/08/15 Javascript
详解如何在Vue2中实现组件props双向绑定
2017/03/29 Javascript
为JQuery EasyUI 表单组件增加焦点切换功能的方法
2017/04/13 jQuery
Nodejs中使用phantom将html转为pdf或图片格式的方法
2017/09/18 NodeJs
20行JS代码实现粘贴板复制功能
2018/02/06 Javascript
微信小程序之圆形进度条实现思路
2018/02/22 Javascript
原生javascript的ajax请求及后台PHP响应操作示例
2020/02/24 Javascript
python实现批量转换文件编码(批转换编码示例)
2014/01/23 Python
Django中ajax发送post请求 报403错误CSRF验证失败解决方案
2019/08/13 Python
复化梯形求积分实例——用Python进行数值计算
2019/11/20 Python
python 用 xlwings 库 生成图表的操作方法
2019/12/22 Python
pytorch实现线性拟合方式
2020/01/15 Python
使用pycharm和pylint检查python代码规范操作
2020/06/09 Python
深入浅析python 中的self和cls的区别
2020/06/20 Python
css3遮罩层镂空效果的多种实现方法
2020/05/11 HTML / CSS
详解css3 flex弹性盒自动铺满写法
2020/09/17 HTML / CSS
Linux常见面试题
2013/03/18 面试题
营销总经理的岗位职责
2013/12/15 职场文书
护理学应聘自荐书范文
2014/02/05 职场文书
《三亚落日》教学反思
2014/04/26 职场文书
研究生论文答辩开场白
2015/05/27 职场文书
幼儿园迎新生欢迎词
2015/09/30 职场文书
2016应届毕业生就业指导课心得体会
2016/01/15 职场文书
SQL IDENTITY_INSERT作用案例详解
2021/08/23 MySQL