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


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判断操作系统的类型实现不同操作系统下的兼容性
Jan 29 Javascript
datagrid框架的删除添加与修改
Apr 08 Javascript
JS实现可缩放、拖动、关闭和最小化的浮动窗口完整实例
Mar 04 Javascript
javascript消除window.close()的提示窗口
May 20 Javascript
JS实现三个层重叠点击互相切换的方法
Oct 06 Javascript
javascript实现表单验证
Jan 29 Javascript
jquery中实现时间戳与日期相互转换
Apr 12 Javascript
vue2项目使用sass的示例代码
Jun 28 Javascript
浅谈vue.js中v-for循环渲染
Jul 26 Javascript
禁止弹窗中蒙层底部页面跟随滚动的几种方法
Dec 07 Javascript
详解Element-UI中上传的文件前端处理
Aug 07 Javascript
python实现迭代法求方程组的根过程解析
Nov 25 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
攻克CakePHP系列一 连接MySQL数据库
2008/10/22 PHP
php Hex RGB颜色值互换的使用
2013/05/10 PHP
php将access数据库转换到mysql数据库的方法
2014/12/24 PHP
php 文件下载 出现下载文件内容乱码损坏的解决方法(推荐)
2016/11/16 PHP
yii2.0整合阿里云oss的示例代码
2017/09/19 PHP
JS 字符串连接[性能比较]
2009/05/10 Javascript
js下获取div中的数据的原理分析
2010/04/07 Javascript
IE6下CSS图片缓存问题解决方法
2010/12/09 Javascript
JavaScript常用对象的方法和属性小结
2012/01/24 Javascript
javascript中[]和{}对象使用介绍
2013/03/20 Javascript
js实现checkbox全选和反选示例
2014/05/01 Javascript
每日十条JavaScript经验技巧(一)
2016/06/23 Javascript
滚动条的监听与内容随着滚动条动态加载的实现
2017/02/08 Javascript
微信小程序 引用其他js文件实现代码
2017/02/22 Javascript
基于ionic实现下拉刷新功能
2018/05/10 Javascript
angular6的响应式表单的实现
2018/10/10 Javascript
jQuery中getJSON跨域原理的深入讲解
2020/09/02 jQuery
python thread 并发且顺序运行示例
2009/04/09 Python
使用python 3实现发送邮件功能
2018/06/15 Python
对python for 文件指定行读写操作详解
2018/12/29 Python
基于keras 模型、结构、权重保存的实现
2020/01/24 Python
Django实现前台上传并显示图片功能
2020/05/29 Python
草莓网英国官网:Strawberrynet UK
2017/02/12 全球购物
汽车专业毕业生推荐信
2013/11/12 职场文书
自荐书模板
2013/12/19 职场文书
英语专业学生个人求职信
2014/01/28 职场文书
学校安全教育制度
2014/01/31 职场文书
党的群众路线对照检查材料
2014/08/27 职场文书
企业年检委托书范本
2014/10/14 职场文书
2014年幼儿园安全工作总结
2014/11/10 职场文书
五四青年节活动总结
2015/02/10 职场文书
三好学生竞选稿
2015/11/21 职场文书
读《庄子》有感:美而不自知
2019/11/06 职场文书
go语言基础 seek光标位置os包的使用
2021/05/09 Golang
《现实主义勇者的王国再建记》第三弹OST全曲试听片段公开
2022/04/04 日漫
CentOS安装Nginx并部署vue
2022/04/12 Servers