JS 文件传参及处理技巧分析_Javascript教程-查字典教程网
JS 文件传参及处理技巧分析
JS 文件传参及处理技巧分析
发布时间:2016-12-30 来源:查字典编辑
摘要:解决思路:1、首先获取到当前JS文件的SRC属性,这里有一个小技巧:我们只需要获取当前页面最后一个script标记内容即可。为什么??因为J...

解决思路:

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>

查字典教程网演示代码 http://demo.jb51.net/js/2011/jscc/

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新Javascript教程学习
    热门Javascript教程学习
    编程开发子分类