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


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 相关文章推荐
js右键菜单效果代码
Jul 21 Javascript
extjs 学习笔记(二) Ext.Element类
Oct 13 Javascript
javascript模拟的Ping效果代码 (Web Ping)
Mar 13 Javascript
node.js 中国天气预报 简单实现
Jun 06 Javascript
JavaScript学习笔记整理_关于表达式和语句
Sep 19 Javascript
Javascript的console['']常用输入方法汇总
Apr 26 Javascript
JS实现判断图片是否加载完成的方法分析
Jul 31 Javascript
javascript和php使用ajax通信传递JSON的实例
Aug 21 Javascript
JS实现的新闻列表自动滚动效果示例
Jan 30 Javascript
vue 实现小程序或商品秒杀倒计时
Apr 14 Javascript
微信小程序canvas分享海报功能
Oct 31 Javascript
JavaScript修改注册表实例代码
Jan 05 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笔记之:php数组相关函数的使用
2013/04/26 PHP
php基于session实现数据库交互的类实例
2015/08/03 PHP
学习php设计模式 php实现建造者模式
2015/12/07 PHP
PHP面向对象五大原则之依赖倒置原则(DIP)详解
2018/04/08 PHP
CSS中一些@规则的用法小结
2021/03/09 HTML / CSS
锋利的jQuery 要点归纳(一) jQuery选择器
2010/03/21 Javascript
JavaScript游戏之优化篇
2010/11/08 Javascript
javascript 进阶篇2 CSS XML学习
2012/03/14 Javascript
javascript采用数组实现tab菜单切换效果
2012/12/12 Javascript
javascript时间自动刷新实现原理与步骤
2013/01/06 Javascript
Jquery焦点图实例代码
2014/11/25 Javascript
Node.js事件循环(Event Loop)和线程池详解
2015/01/28 Javascript
JS定义网页表单提交(submit)的方法
2015/03/20 Javascript
Jquery实现弹性滑块滑动选择数值插件
2015/08/08 Javascript
JavaScript代码里的判断小结
2016/08/22 Javascript
jquery.zclip轻量级复制失效问题
2017/01/08 Javascript
ionic环境配置及问题详解
2017/06/27 Javascript
web页面和微信小程序页面实现瀑布流效果
2018/09/26 Javascript
微信小程序实现选项卡效果
2018/11/06 Javascript
javascript关于“时间”的一次探索
2019/07/24 Javascript
vue使用高德地图根据坐标定位点的实现代码
2019/08/22 Javascript
Vue 动态组件components和v-once指令的实现
2019/08/30 Javascript
[01:56]《DOTA2》中文配音CG
2013/04/22 DOTA
Flask 让jsonify返回的json串支持中文显示的方法
2018/03/26 Python
Python二进制文件读取并转换为浮点数详解
2019/06/25 Python
Django中如何使用sass的方法步骤
2019/07/09 Python
python判断链表是否有环的实例代码
2020/01/31 Python
通过Turtle库在Python中绘制一个鼠年福鼠
2020/02/03 Python
python+selenium+Chrome options参数的使用
2020/03/18 Python
css3 transform导致子元素固定定位变成绝对定位的方法
2020/03/06 HTML / CSS
你所知道的集合类都有哪些?主要方法?
2012/12/31 面试题
J2EE系统只能是基于web
2015/09/08 面试题
卫生系统先进事迹
2014/05/13 职场文书
获奖感言一句话
2015/07/31 职场文书
一篇合格的广告文案,其主要目的是什么?
2019/07/12 职场文书
Linux中各个目录的作用与内容
2022/06/28 Servers