作家
登录

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

作者: 来源:www.28hudong.com 2013-03-30 01:35:49 阅读 我要评论

解决思路: 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/

  推荐阅读

  高性能web开发 如何加载JS,JS应该放在什么位置?

外部JS的阻塞下载 所有浏览器在下载JS的时候,会阻止一切其他活动,比如其他资源的下载,内容的呈现等等。至到JS下载、解析、执行完毕后才开始继续并行下载其他资源并呈现内容。 有人会问:为什么JS不能像CSS、ima>>>详细阅读


本文标题:JS 文件传参及处理技巧分析

地址:http://www.17bianji.com/kaifa2/JS/26410.html

关键词: 探索发现

乐购科技部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与乐购科技进行文章共享合作。

网友点评
自媒体专栏

评论

热度

精彩导读
栏目ID=71的表不存在(操作类型=0)