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


Posted in Javascript onMay 13, 2010

解决思路:

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.3water.com/js/2011/jscc/
Javascript 相关文章推荐
JavaScript性能优化 创建文档碎片(document.createDocumentFragment)
Jul 13 Javascript
java、javascript实现附件下载示例
Aug 14 Javascript
javascript清空table表格的方法
May 14 Javascript
JavaScript中的继承之类继承
May 01 Javascript
基于gulp合并压缩Seajs模块的方式说明
Jun 14 Javascript
JS中的进制转换以及作用
Jun 26 Javascript
JQuery Ajax WebService传递参数的简单实例
Nov 02 Javascript
微信小程序 获取当前地理位置和经纬度实例代码
Dec 05 Javascript
angularjs中使用ng-bind-html和ng-include的实例
Apr 28 Javascript
node前端开发模板引擎Jade的入门
May 11 Javascript
基于ant design日期控件使用_仅月份的操作
Oct 27 Javascript
在vant中使用时间选择器和popup弹出层的操作
Nov 04 Javascript
Javascript 面向对象 继承
May 13 #Javascript
Javascript 面向对象 对象(Object)
May 13 #Javascript
Javascript 面向对象 命名空间
May 13 #Javascript
javascript 面向对象 function类
May 13 #Javascript
该如何加载google-analytics(或其他第三方)的JS
May 13 #Javascript
Javascript 面向对象 继承
May 13 #Javascript
Javascript 面向对象 重载
May 13 #Javascript
You might like
用PHP和ACCESS写聊天室(六)
2006/10/09 PHP
php正则表达匹配中文问题分析小结
2012/03/25 PHP
php实现数据库的增删改查
2017/02/26 PHP
PHP实现git部署的方法教程
2017/12/19 PHP
js 处理URL实用技巧
2010/11/23 Javascript
jquery获取自定义属性(attr和prop)实例介绍
2013/04/21 Javascript
js 弹出新页面避免被浏览器、ad拦截的一种新方法
2014/04/30 Javascript
深入理解JavaScript系列(37):设计模式之享元模式详解
2015/03/04 Javascript
JavaScript整除运算函数ceil和floor的区别分析
2015/04/14 Javascript
jQuery+ajax实现无刷新级联菜单示例
2015/05/21 Javascript
纯css实现窗户玻璃雨滴逼真效果
2015/08/23 Javascript
JSON遍历方式实例总结
2015/12/07 Javascript
JS实现类似51job上的地区选择效果示例
2016/11/17 Javascript
基于Vue.js实现简单搜索框
2020/03/26 Javascript
jQuery焦点图左右转换效果
2016/12/12 Javascript
AngularJS中的按需加载ocLazyLoad示例
2017/01/11 Javascript
JS实现微信摇一摇原理解析
2017/07/22 Javascript
JavaScript实现简单的双色球(实例讲解)
2017/07/31 Javascript
聊聊Vue 中 title 的动态修改问题
2019/06/11 Javascript
vue.js中ref和$refs的使用及示例讲解
2019/08/14 Javascript
详解JavaScript 作用域
2020/07/14 Javascript
Python 文件重命名工具代码
2009/07/26 Python
python traceback捕获并打印异常的方法
2018/08/31 Python
详解python内置模块urllib
2020/09/09 Python
Python爬虫如何破解JS加密的Cookie
2020/11/19 Python
Python偏函数实现原理及应用
2020/11/20 Python
印尼在线精品店:Berrybenka.com
2016/10/22 全球购物
Richards网上商店:当代时尚,遍布巴西
2019/11/03 全球购物
英国奢侈品牌时尚购物平台:Farfetch(支持中文)
2020/02/18 全球购物
社区敬老月活动实施方案
2014/02/17 职场文书
家长对老师的评语
2014/04/18 职场文书
党的群众路线教育实践活动党员个人整改措施
2014/10/27 职场文书
应届生求职自荐信范文
2015/03/04 职场文书
出国留学自荐信模板
2015/03/06 职场文书
乡镇党建工作总结2015
2015/05/19 职场文书
2015大一新生军训感言
2015/08/01 职场文书