JS 文件传参及处理技巧分析(转)

JS 文件传参及处理技巧分析

其实为 js文件传参是很久就接触过的一个问题,只是一直没有放在心上,今天在无忧看到又有人问这个问题,今日总结一下。
解决思路: 

1、首先获取到当前 JS文件的SRC属性,这里有一个小技巧:我们只需要获取当前页面最后一个script标记内容即可。 
为什么??因为 JS是顺序解析的,当前 JS脚本解析时后面的 js都还没有解析到,当然就认为自己就是最后一个script了。此外,这样获取还有一个好处:我们可以多次引用同一个 文件且传入不同的参数,这样可以在 js文件中根据参数不同做不同处理,很巧妙把!简直就是动态语言了。 
代码如下: 
复制代码 代码如下:

var scripts=document.getElementsByTagName("script"); 
var curJS=scripts[scripts.length-1]; //curJS就是我们当前的 js文件 

得到这个就好办了,通过curJS.src即可获取到完整的路径内容(包括参数)。 

2、下面的就是解析参数内容了,解析的过程相当简单,相信很多人都容易完成这一步。 
但我们要对一个特殊情况进行处理:如果一个参数被传入了多次,则要将该参数值转换为数组存储每一个传入的值。 

完整测试脚本如下: 

复制代码 代码如下:

var getArgs=(function(){ 
var sc=document.getElementsByTagName('script'); 
var paramsArr=sc[sc.length-1].src.split('?')[1].split('&'); 
var args={},argsStr=[],param,t,name,value; 
for(var i=0,len=paramsArr.length;i<len;i++){ 
param=paramsArr[i].split('='); 
name=param[0],value=param[1]; 
if(typeof args[name]=="undefined"){ //参数尚不存在 
args[name]=value; 
}else if(typeof args[name]=="string"){ //参数已经存在则保存为数组 
args[name]=[args[name]] 
args[name].push(value); 
}else{ //已经是数组的 
args[name].push(value); 


/*在实际应用中下面的showArg和args.toString可以删掉,这里只是为了测试函数getArgs返回的内容*/ 
var showArg=function(x){ //转换不同数据的显示方式 
if(typeof(x)=="string"&&!/\d+/.test(x)) return "'"+x+"'"; //字符串 
if(x instanceof Array) return "["+x+"]" //数组 
return x; //数字 

//组装成json格式 
args.toString=function(){ 
for(var i in args) argsStr.push(i+':'+showArg(args[i])); 
return '{'+argsStr.join(',')+'}'; 

return function(){return args;} //以json格式返回获取的所有参数 
})(); 

alert(getArgs()); 
alert("username:"+getArgs()["username"]); 


测试示例的HTML源码: 
复制代码 代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title> new document </title> 
<meta name="generator" content="editplus" /> 
<meta name="author" content="" /> 
<meta name="keywords" content="" /> 
<meta name="description" content="" /> 
<script type="text/javascript" src="test. js?id=4&username=yemoo&id=1&uid=110"></script> 
<script type="text/javascript" src="test. js?id=5&username=ajaxbbs&id=7&uid=253"></script> 
<script type="text/javascript" src="test. js?id=6&username=jack&id=8&uid=258"></script> 
</head> 
<body> 
</body> 
</html> 
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值