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


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 相关文章推荐
jquery 得到当前页面高度和宽度的两个函数
Feb 21 Javascript
jquery easyui combox一些实用的小方法
Dec 25 Javascript
jquery复选框全选/取消示例
Dec 30 Javascript
JS实现的手机端精简幻灯片效果
Sep 05 Javascript
jQuery在ie6下无法设置select选中的解决方法详解
Sep 20 Javascript
Bootstrap基本布局实现方法详解
Nov 25 Javascript
JavaScript中三个等号和两个等号你了解多少
Jul 04 Javascript
用javascript获取任意颜色的更亮或更暗颜色值示例代码
Jul 21 Javascript
vue2单元测试环境搭建
May 24 Javascript
vue2.0基于vue-cli+element-ui制作树形treeTable
Apr 30 Javascript
javascript实现视频弹幕效果(两个版本)
Nov 28 Javascript
Vue跨域请求问题解决方案过程解析
Aug 07 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实现浏览器点击下载TXT文档的方法详解
2013/06/02 PHP
php 多进程编程父进程的阻塞与非阻塞实例分析
2020/02/22 PHP
PHP使用openssl扩展实现加解密方法示例
2020/02/20 PHP
获取任意Html元素与body之间的偏移距离 offsetTop、offsetLeft (For:IE5+ FF1 )[
2006/12/22 Javascript
javascript 学习笔记(一)DOM基本操作
2011/04/08 Javascript
再次分享18个非常棒的jQuery表格插件
2011/04/10 Javascript
用JQUERY增删元素的代码
2012/02/14 Javascript
js style动态设置table高度
2014/10/21 Javascript
浅谈javascript 迭代方法
2015/01/21 Javascript
JavaScript将XML转成JSON的方法
2015/03/12 Javascript
jQuery自动添加表单项的方法
2015/07/13 Javascript
javascript解决IE6下hover问题的方法
2015/07/28 Javascript
javascript省市级联功能实现方法实例详解
2015/10/20 Javascript
百度地图给map添加右键菜单(判断是否为marker)
2016/03/04 Javascript
Three.js快速入门教程
2016/09/09 Javascript
jQuery Validate验证表单时多个name相同的元素只验证第一个的解决方法
2016/12/24 Javascript
js 递归和定时器的实例解析
2017/02/03 Javascript
67 个节约开发时间的前端开发者的工具、库和资源
2017/09/12 Javascript
vue弹窗消息组件的使用方法
2020/09/24 Javascript
node中间层实现文件上传功能
2018/06/11 Javascript
vue权限路由实现的方法示例总结
2018/07/29 Javascript
vue中filters 传入两个参数 / 使用两个filters的实现方法
2019/07/15 Javascript
vue路由结构可设一层方便动态添加路由操作
2020/08/31 Javascript
详解JavaScript之Array.reduce源码解读
2020/11/01 Javascript
Python基于二分查找实现求整数平方根的方法
2016/05/12 Python
如何使用Python处理HDF格式数据及可视化问题
2020/06/24 Python
Canvas实现保存图片到本地的示例代码
2018/06/28 HTML / CSS
日本最大的药妆连锁店:Matsukiyo松本清药妆店
2017/11/23 全球购物
技术学校毕业生求职信分享
2013/12/02 职场文书
事业单位鉴定材料
2014/05/25 职场文书
幼儿园端午节活动方案
2014/08/25 职场文书
餐饮服务员岗位职责
2015/02/09 职场文书
综合办公室岗位职责
2015/04/11 职场文书
员工聘用合同范本
2015/09/21 职场文书
2016幼儿教师自荐信范文
2016/01/28 职场文书
Python机器学习应用之基于线性判别模型的分类篇详解
2022/01/18 Python