我的脚本 src URL 是什么？

Question

是否有一种简单可靠的方法来确定当前正在执行的 JavaScript 文件（网页内）的 URL？

我对此的唯一想法是扫描 DOM 中的所有脚本 src 属性，以查找如何引用当前文件，然后通过将其应用于 document.location 来找出绝对 URL代码>. 有人有其他想法吗，有没有一些我完全忽略的超级简单的方法？

更新：通过 DOM 访问的脚本元素已经有一个包含完整 URL 的 src 属性。 我不知道这是多么普遍/标准，但您也可以使用 getAttribute("src") 它将返回 [X]HTML 中的任何原始属性值。

Answer 1

把它放在需要知道它自己的url的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)
}());

请参阅http://www.glennjones.net/Post/809/getAttributehrefbug.htm 用于解释所使用的 getAttribute 参数（这是一个 IE 错误）。

Answer 2

对于最新的浏览器，您可以使用 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

Answer 3

如源代码中所示（例如 /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）：

经过一些测试，似乎很难在交叉中获得完全合格的浏览器方式。 Crescent Fresh 建议的解决方案 在 IE8 中无法获得完全合格的，即使它适用于 IE7

Answer 4

此方法适用于延迟、异步和延迟加载
因为您知道脚本的文件名，并且它是否是唯一的

/* 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);
                }
          }
     });
}

Answer 5

如果这是一个严格的客户端解决方案，那么您的解决方案听起来不错。

如果您在服务器上编写代码，您可能只需使用脚本的完全解析 URL 填充 div/隐藏字段/（在此处插入您最喜欢的 HTML 元素），然后使用客户端的 javascript 获取该内容。

Answer 6

您可能想查看 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）

但是，为什么这很重要？ 如果脚本已经导致错误，那么很容易确定错误发生的位置。 如果根本与错误无关，那么知道它来自哪个文件有什么好处？