是否有一种简单可靠的方法来确定当前正在执行的JavaScript文件的URL(在网页内)?
我唯一想到的是扫描DOM以获取所有脚本src
属性,以查找当前文件的引用方式,然后通过将其应用于document.location
来确定绝对URL。任何人都有其他想法,是否有一些我完全忽略的超级简单方法?
更新:通过DOM访问的脚本元素已经具有src
属性,其中包含完整的URL。我不知道它是多么普遍/标准,但是你可以使用getAttribute("src")
来返回[X] HTML中的任何原始属性值。
答案 0 :(得分:40)
将此信息放入需要知道自己网址的js文件中。
完全合格(例如http://www.example.com/js/main.js
):
var scriptSource = (function(scripts) {
var scripts = document.getElementsByTagName('script'),
script = scripts[scripts.length - 1];
if (script.getAttribute.length !== undefined) {
return script.src
}
return script.getAttribute('src', -1)
}());
或者
出现在源中(例如/js/main.js
):
var scriptSource = (function() {
var scripts = document.getElementsByTagName('script'),
script = scripts[scripts.length - 1];
if (script.getAttribute.length !== undefined) {
return script.getAttribute('src')
}
return script.getAttribute('src', 2)
}());
有关正在使用的getAttribute
参数的解释,请参阅http://www.glennjones.net/Post/809/getAttributehrefbug.htm。这是一个IE错误。
答案 1 :(得分:31)
对于最近的浏览器,您可以使用document.currentScript来获取此信息。
var mySource = document.currentScript.src;
好处是它对于异步加载的脚本更可靠。缺点是,据我所知,它并非普遍支持。它应该适用于Chrome> = 29,FireFox> = 4,Opera> = 16.像许多有用的东西一样,它似乎在IE中不起作用。
当我需要获取脚本路径时,我会检查是否定义了document.currentScript,如果没有,则使用接受的答案中描述的方法。
if (document.currentScript) {
mySource = document.currentScript.src;
} else {
// code omitted for brevity
}
https://developer.mozilla.org/en-US/docs/Web/API/document.currentScript
答案 2 :(得分:6)
正如它在源中所示(例如/js/main.js
),这是跨浏览器:
var scriptSource = (function()
{
var scripts = document.getElementsByTagName('script'),
script = scripts[scripts.length - 1];
//No need to perform the same test we do for the Fully Qualified
return script.getAttribute('src', 2); //this works in all browser even in FF/Chrome/Safari
}());
完全合格(例如http://www.example.com/js/main.js
):
经过一些测试后,似乎很难以跨浏览器的方式获得完全合格的。 solution suggested by Crescent Fresh 在IE8中不起作用以获得完全限定,即使它在IE7中有效
答案 3 :(得分:5)
此方法适用于延迟,异步和延迟加载 因为您知道脚本的文件名,以及它是否是唯一的
/* see
* http://stackoverflow.com/questions/984510/what-is-my-script-src-url/984656#984656
* http://www.glennjones.net/Post/809/getAttributehrefbug.htm
*
* iterate all script to find script with right filename
* this work with async and defer (but your script MUST have a unique filemane)
* mozilla support document.currentScript and we use it, if is set
*
* this will not work with local script loaded by jQuery.getScript(),
* since there is no script tag added into the dom. the script is only evaluated in global space.
* http://api.jquery.com/jQuery.getScript/
*
* to fix this odd, you can add a reference in meta ( meta[name=srcipt][content=url] )
* when you load the script
*/
var scriptFilename = 'jquery.plugins.template.js'; // don't forget to set the filename
var scriptUrl = (function() {
if (document.currentScript) { // support defer & async (mozilla only)
return document.currentScript.src;
} else {
var ls,s;
var getSrc = function (ls, attr) {
var i, l = ls.length, nf, s;
for (i = 0; i < l; i++) {
s = null;
if (ls[i].getAttribute.length !== undefined) {
s = ls[i].getAttribute(attr, 2);
}
if (!s) continue; // tag with no src
nf = s;
nf = nf.split('?')[0].split('/').pop(); // get script filename
if (nf === scriptFilename) {
return s;
}
}
};
ls = document.getElementsByTagName('script');
s = getSrc(ls, 'src');
if ( !s ) { // search reference of script loaded by jQuery.getScript() in meta[name=srcipt][content=url]
ls = document.getElementsByTagName('meta');
s = getSrc(ls, 'content');
}
if ( s ) return s;
}
return '';
})();
var scriptPath = scriptUrl.substring(0, scriptUrl.lastIndexOf('/'))+"/";
一个jquery插件模板: https://github.com/mkdgs/mkdgs-snippet/blob/master/javascript/jquery.plugins.template.js
注意:这不适用于jQuery.getScript()加载的本地脚本,因为dom中没有添加脚本标记。该脚本仅在全局空间中进行评估。 http://api.jquery.com/jQuery.getScript/
要解决此问题,您可以执行以下操作:
function loadScript(url,callback) {
if ( $('[src="'+url+'"]').length ) return true; // is already loaded
// make a reference of the loaded script
if ( $('meta[content="'+url+'"]', $("head")).length ) return true; // is already loaded
var meta = document.createElement('meta');
meta.content = url;
meta.name = 'script';
$("head").append(meta);
return $.ajax({
cache: true,
url: u,
dataType: 'script',
async: false,
success : function (script) {
try {
if ( typeof callback == 'function' ) callback();
} catch (error) {
//console.log(error);
}
}
});
}
答案 4 :(得分:0)
如果这是一个严格的客户解决方案,你的声音听起来不错。
如果您正在服务器上编写代码,您可能只需填充一个div / hidden字段/(在此处插入您最喜欢的HTML元素)和完全解析的脚本URL,然后在客户端使用您的javascript选择它
答案 5 :(得分:0)
如果您有兴趣了解哪些功能(以及哪个文件)在您无法控制的页面上执行,您可能需要查看https://addons.mozilla.org/en-US/firefox/addon/10345。
如果您想知道哪些 脚本正在执行,那么有很多方法。使用Firebug,您可以console.log()
获取信息。即使只是在代码中放置警报语句(虽然烦人)也可以帮助以低技术方式进行调试。您还可以引发错误并捕获它们,然后使用错误的属性进行处理(请参阅:https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Error)
然而,为什么这很重要?如果脚本已经导致错误,那么很容易确定错误发生的位置。如果它根本不是错误,那么知道它来自哪个文件的优势是什么?