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 相关文章推荐
关于在IE下的一个安全BUG --可用于跟踪用户的系统鼠标位置
Apr 17 Javascript
js取得html iframe中的元素和变量值
Jun 30 Javascript
javascript实现五星评价代码(源码下载)
Aug 11 Javascript
JS中dom0级事件和dom2级事件的区别介绍
May 05 Javascript
JS获取checkbox的个数简单实例
Aug 19 Javascript
原生js实现鼠标跟随效果
Feb 28 Javascript
使用vue-resource进行数据交互的实例
Sep 02 Javascript
Vue监听数据渲染DOM完以后执行某个函数详解
Sep 11 Javascript
深入浅析golang zap 日志库使用(含文件切割、分级别存储和全局使用等)
Feb 19 Javascript
js实现整体缩放页面适配移动端
Mar 31 Javascript
Vue 基于 vuedraggable 实现选中、拖拽、排序效果
May 18 Javascript
JQuery插件tablesorter表格排序实现过程解析
May 28 jQuery
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 随机数的深入理解
2013/06/05 PHP
php ZipArchive压缩函数详解实例
2013/11/06 PHP
codeigniter使用技巧批量插入数据实例方法分享
2013/12/31 PHP
php中使用base HTTP验证的方法
2015/04/20 PHP
PHP程序中使用adodb连接不同数据库的代码实例
2015/12/19 PHP
从Ajax到JQuery Ajax学习
2007/02/14 Javascript
一段效率很高的for循环语句使用方法
2007/08/13 Javascript
JavaScript 字符编码规则
2009/05/04 Javascript
JavaScript 异步调用框架 (Part 6 - 实例 &amp; 模式)
2009/08/04 Javascript
jquery 与NVelocity 产生冲突的解决方法
2011/06/13 Javascript
只需20行代码就可以写出CSS覆盖率测试脚本
2013/04/24 Javascript
jQuery jcrop插件截图使用方法
2013/11/20 Javascript
$.each与$().each的区别示例介绍
2014/03/20 Javascript
15款jQuery分布引导插件分享
2015/02/04 Javascript
使用jQuery实现图片遮罩半透明坠落遮挡
2015/03/16 Javascript
1秒50万字!js实现关键词匹配
2016/08/01 Javascript
jquery 中toggle的2种用法详解(推荐)
2016/09/02 Javascript
详解jquery选择器的原理
2017/08/01 jQuery
jQuery md5加密插件jQuery.md5.js用法示例
2018/08/24 jQuery
jquery获取img的src值实例介绍
2019/01/16 jQuery
JavaScript之实现一个简单的Vue示例
2019/01/17 Javascript
前端深入理解Typescript泛型概念
2020/03/09 Javascript
Python实现简单登录验证
2016/04/13 Python
django静态文件加载的方法
2018/05/20 Python
python实现简单图片物体标注工具
2019/03/18 Python
python入门之井字棋小游戏
2020/03/05 Python
Django模板报TemplateDoesNotExist异常(亲测可行)
2020/12/18 Python
Sofmap官网:日本著名的数码电器专卖店
2017/05/19 全球购物
黑猩猩商店:The Chimp Store
2020/02/12 全球购物
Tomcat中怎么使用log4j输出所有的log
2016/07/07 面试题
一年级数学上册复习计划
2015/01/17 职场文书
秋菊打官司观后感
2015/06/03 职场文书
2016年基层党组织创先争优承诺书
2016/03/25 职场文书
护理专业毕业自我鉴定
2019/08/12 职场文书
教师节作文之小学四年级
2019/09/03 职场文书
分享node.js实现简单登录注册的具体代码
2022/04/26 NodeJs