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 相关文章推荐
一些常用的JS功能函数(2009-06-04更新)
Jun 04 Javascript
JavaScript 盒模型 尺寸深入理解
Dec 31 Javascript
中文输入法不触发onkeyup事件的解决办法
Jul 09 Javascript
javascript版2048小游戏
Mar 18 Javascript
JS日期对象简单操作(获取当前年份、星期、时间)
Oct 26 Javascript
微信小程序 解决请求服务器手机预览请求不到数据的方法
Jan 04 Javascript
简单实现jQuery级联菜单
Jan 09 Javascript
详解闭包解决jQuery中AJAX的外部变量问题
Feb 22 Javascript
node.js入门学习之url模块
Feb 25 Javascript
如何在vue里添加好看的lottie动画
Aug 02 Javascript
Vue使用JSEncrypt实现rsa加密及挂载方法
Feb 07 Javascript
用JS创建一个录屏功能
Nov 11 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检查日期函数checkdate用法实例
2015/03/19 PHP
深入浅析yii2-gii自定义模板的方法
2016/04/26 PHP
thinkphp 中的volist标签在ajax操作中的特殊性(推荐)
2018/01/15 PHP
Laravel框架实现的批量删除功能示例
2019/01/16 PHP
List the Stored Procedures in a SQL Server database
2007/06/20 Javascript
jquery win 7透明弹出层效果的简单代码
2013/08/06 Javascript
禁止IE用右键的JS代码
2013/12/30 Javascript
jquery禁止回车触发表单提交
2014/12/12 Javascript
nodejs实现遍历文件夹并统计文件大小
2015/05/28 NodeJs
JS实现可拖曳、可关闭的弹窗效果
2015/09/26 Javascript
每天一篇javascript学习小结(Date对象)
2015/11/13 Javascript
基于javascript如何传递特殊字符
2015/11/30 Javascript
轻松实现jquery选项卡切换效果
2016/10/10 Javascript
jQuery实现打开网页自动弹出遮罩层或点击弹出遮罩层功能示例
2017/10/19 jQuery
小程序从手动埋点到自动埋点的实现方法
2019/01/24 Javascript
vue props对象validator自定义函数实例
2019/11/13 Javascript
vue使用nprogress实现进度条
2019/12/09 Javascript
单线程JavaScript实现异步过程详解
2020/05/19 Javascript
javascript实现图片轮换动作方法
2020/08/07 Javascript
Python删除指定目录下过期文件的2个脚本分享
2014/04/10 Python
Python对字符串实现去重操作的方法示例
2017/08/11 Python
利用Python实现在同一网络中的本地文件共享方法
2018/06/04 Python
python生成多个只含0,1元素的随机数组或列表的实例
2018/11/12 Python
Python常用模块之requests模块用法分析
2019/05/15 Python
使用coverage统计python web项目代码覆盖率的方法详解
2019/08/05 Python
Python中的引用和拷贝实例解析
2019/11/14 Python
python修改文件内容的3种方法详解
2019/11/15 Python
matplotlib 范围选区(SpanSelector)的使用
2021/02/24 Python
美国派对用品及装饰品网上商店:Shindigz
2016/07/30 全球购物
英国护肤品购物网站:Beauty Expert
2016/08/19 全球购物
粉红色的鲸鱼:Vineyard Vines
2018/02/17 全球购物
某同学的自我鉴定范文
2013/12/26 职场文书
行政助理的岗位职责
2014/02/18 职场文书
Python中Cookies导出某站用户数据的方法
2021/05/17 Python
SpringMVC 整合SSM框架详解
2021/08/30 Java/Android
WINDOWS 64位 下安装配置mysql8.0.25最详细的教程
2022/03/22 MySQL