在浏览器中获取当前执行的脚本文件名的代码


Posted in Javascript onJuly 19, 2011

背景
同事提了一个问题,如何在浏览器中动态插入的 JavaScript 文件中,获取当前文件名?

除了服务器输出一个文件名外,在脚本中获取应该只有下面三种做法。

解法A
普遍的解法,只能用于页面静态scripts标签引入或者单个动态加载。

var scripts = document.getElementsByTagName('script'); 
var filename = scripts[scripts.length -1].src;

动态插入多个脚本标签的情况:
loadScript('b.js?param=1') 
loadScript('a.js?param=2') 
loadScript('b.js?param=3') 
loadScript('a.js?param=4') /* 输出 
a.js >>> http://localhost:800/io/a.js?param=4 
a.js >>> http://localhost:800/io/a.js?param=4 
b.js >>> http://localhost:800/io/a.js?param=4 
b.js >>> http://localhost:800/io/a.js?param=4 
*/

解法B
变态型,只能工作于FireFox:
try { 
throw new Error(); 
} 
catch(exception){ 
console.log( exception.fileName ); 
}

解法C
我的解法,操作源代码:
requireScript('a.js?'+Date.now(),function(text,src) { 
console.log('text:',text); 
globalEval('(function() { \nvar __filename = "'+ src +'";\n'+ text +'\n;})();'); 
})

浏览器输出:
<script>(function() { 
var __filename = "a.js?1310971812334"; 
var scripts = document.getElementsByTagName('script'); 
console.log('a.js',' >>> ',scripts[scripts.length -1].src); 
console.log(__filename); 
;})();</script>

优点:可靠、可缓存、可推迟执行、可扩展。
限制:1)变量命名被约定为“__filename”;2)同源策略。
又想到这个加载策略用来加载流行的 CoffeeScript,比如:

requireScript('script.coffee',function(text,src) { 
if( isCoffeeScript(src) ) 
globalEval( CoffeeScript.compile(text) ); 
})

链接

Cross-Origin Resource Sharing

Passing JavaScript arguments via the src attribute

CoffeeScript

查看或下载

https://gist.github.com/1088730

Javascript 相关文章推荐
JavaScript delete操作符应用实例
Jan 13 Javascript
js在数组中删除重复的元素自保留一个(两种实现思路)
Aug 22 Javascript
javascript 事件处理示例分享
Dec 31 Javascript
元素绑定click点击事件方法
Jun 08 Javascript
Bootstrap对话框使用实例讲解
Sep 24 Javascript
BootStrap中关于Select下拉框选择触发事件及扩展
Nov 22 Javascript
js实现键盘自动打字效果
Dec 23 Javascript
jquery表单验证插件validation使用方法详解
Jan 20 Javascript
JS奇技之利用scroll来监听resize详解
Jun 15 Javascript
微信小程序实现倒计时60s获取验证码
Apr 17 Javascript
Vue 指令实现按钮级别权限管理功能
Apr 23 Javascript
微信小程序 腾讯地图显示偏差问题解决
Jul 27 Javascript
iframe 异步加载技术及性能分析
Jul 19 #Javascript
15款优秀的jQuery导航菜单插件分享
Jul 19 #Javascript
jQuery .tmpl(), .template()学习资料小结
Jul 18 #Javascript
JS仿flash上传头像效果实现代码
Jul 18 #Javascript
js中的string.format函数代码
Aug 11 #Javascript
关于html+ashx开发中几个问题的解决方法
Jul 18 #Javascript
TreeView 用法(有代码)(asp.net)
Jul 15 #Javascript
You might like
PHP中实现进程间通讯
2006/10/09 PHP
一个PHP+MSSQL分页的例子
2006/10/09 PHP
php实现CSV文件导入和导出
2015/10/24 PHP
JQUERY操作JSON实例代码
2010/02/09 Javascript
ASP.NET jQuery 实例4(复制TextBox的文本到本地剪贴板上)
2012/01/13 Javascript
jQuery实现强制cookie过期方法汇总
2015/05/22 Javascript
node.js读取文件到字符串的方法
2015/06/29 Javascript
javascript实现在指定元素中垂直水平居中
2015/09/13 Javascript
基于JavaScript实现购物网站商品放大镜效果
2016/09/06 Javascript
Node.js的基本知识简单汇总
2016/09/19 Javascript
详解vue-cli开发环境跨域问题解决方案
2017/06/06 Javascript
微信小程序 http请求的session管理
2017/06/07 Javascript
layer插件select选中默认值的方法
2018/08/14 Javascript
node基于async/await对mysql进行封装
2019/06/20 Javascript
微信小程序中button去除默认的边框实例代码
2019/08/01 Javascript
JavaScript计算正方形面积
2019/11/26 Javascript
解决Vue的文本编辑器 vue-quill-editor 小图标样式排布错乱问题
2020/08/03 Javascript
JS pushlet XMLAdapter适配器用法案例解析
2020/10/16 Javascript
适用于 Vue 的播放器组件Vue-Video-Player操作
2020/11/16 Javascript
如何在Vue项目中添加接口监听遮罩
2021/01/25 Vue.js
vue实现轮播图帧率播放
2021/01/26 Vue.js
[48:05]2018DOTA2亚洲邀请赛 3.31 小组赛 B组 VGJ.T vs VP
2018/03/31 DOTA
[12:29]2018国际邀请赛 开幕秀
2018/08/22 DOTA
Pyramid Mako模板引入helper对象的步骤方法
2013/11/27 Python
Windows下PyMongo下载及安装教程
2015/04/27 Python
在Python程序中操作文件之flush()方法的使用教程
2015/05/24 Python
Ubuntu下创建虚拟独立的Python环境全过程
2017/02/10 Python
基于Python os模块常用命令介绍
2017/11/03 Python
基于Django contrib Comments 评论模块(详解)
2017/12/08 Python
目前最全的python的就业方向
2018/06/05 Python
Python生成个性签名图片获取GUI过程解析
2019/12/16 Python
世界上最大的乐器零售商:Guitar Center
2017/11/07 全球购物
温泉秘密:Onsen Secret
2020/07/06 全球购物
业务员薪酬管理制度
2014/01/15 职场文书
学校读书活动总结
2014/06/30 职场文书
图书馆义工感想
2015/08/07 职场文书