【问题标题】:Get the url of currently executing js file when dynamically loaded动态加载时获取当前正在执行的js文件的url
【发布时间】:2011-01-17 16:34:56
【问题描述】:

所以我尝试动态加载脚本并找出加载该脚本的 URL 路径。因此,如果脚本是静态加载的(How to get the file-path of the currently executing javascript code),那么有人给了我一个非常棒的解决方案来解决这个问题。但我需要一个动态加载的解决方案。例如:

$(function()
{   $.getScript("brilliant.js", function(data, textStatus)
    {   // do nothing   
    });
});

“brilliant.js”在哪里:

var scripts = document.getElementsByTagName("script");
var src = scripts[scripts.length-1].src;
alert("THIS IS: "+src);

理想情况下,这应该打印出“brilliant.js”或“〈hostname+basepath〉/brilliant.js”

目前,brilliant.js 适用于静态包含的脚本,但不适用于动态包含的脚本(如 $.getScript)。谁有想法? dom 中是否有某个地方存储了所有已加载的脚本?

编辑:Andras 提供了一个非常好的解决方案,尽管它可能只适用于 jQuery。因为这可能是最受欢迎的库,而且肯定是我将要使用的库。它也可以扩展到其他库。这是我的简化版:

var scriptUri;
curScriptUrl(function(x)
{   scriptUri = x;
    alert(scriptUri);
});

function curScriptUrl(callback)
{   var scripts = document.getElementsByTagName("script");
    var scriptURI = scripts[scripts.length-1].src;  

    if(scriptURI != "")         // static include
    {   callback(scriptURI);
    }else if($ != undefined)    // jQuery ajax
    {   $(document).ajaxSuccess(function(e, xhr, s)
        {   callback(s.url);
        }); 
    }
}

【问题讨论】:

  • 我喜欢 chamiltongt(下)所说的,代码中的 ajax,然后 eval() 它。为了使其普遍可访问,为什么不建立一个微型站点来提供您的 .js 代码。它将是集中式的,您可以立即为每个用户更新您的代码。

标签: javascript jquery ajax include load


【解决方案1】:

这将适用于除 IE 之外的所有浏览器,并且不依赖于假设文件的名称:

var getErrorLocation = function (error) {
    var loc, replacer = function (stack, matchedLoc) {
        loc = matchedLoc;
    };

    if ("fileName" in error) {
        loc = error.fileName;
    } else if ("stacktrace" in error) { // Opera
        error.stacktrace.replace(/Line \d+ of .+ script (.*)/gm, replacer);
    } else if ("stack" in error) { // WebKit
        error.stack.replace(/at (.*)/gm, replacer);
        loc = loc.replace(/:\d+:\d+$/, ""); // remove line number
    }
    return loc;
};

try {
    0();
} catch (e) {
    var scriptURI = getErrorLocation(e);
}

alert("THIS IS: " + scriptURI);

【讨论】:

  • 他正在使用 $.getScript() 加载脚本,这相当于附加一个没有 src 属性的
【解决方案2】:

当您的脚本被 jQuery 加载时(我猜其他框架也是如此),您的脚本将变得与最初在 HTML 文档中的脚本无法区分。

jQuery 向您的脚本发出请求,并将回复作为

但是,可以有一些解决方法。对于 jQuery,您可以连接到 ajax 事件并利用它们在脚本执行后立即调用的事实。基本上,这将在您的示例中产生“brilliant.js”:

var handler = function (e, xhr, s) {
    alert(s.url);
}

$(document).ajaxSuccess(handler);

更详细的:

(function ($, undefined) {

    /* Let's try to figure out if we are inlined.*/
    var scripts = document.getElementsByTagName("script");

    if (scripts[scripts.length - 1].src.length === 0) {
        // Yes, we are inlined.
        // See if we have jQuery loading us with AJAX here. 
        if ($ !== undefined) {
            var initialized = false;
            var ajaxHandler = function (e, xhr, s) {
                if (!initialized) {
                    initialized = true;
                    alert("Inlined:" + s.url);
                    initmywholejsframework();
                }
            }

            //If it is, our handler will be called right after this file gets loaded.
            $(document).ajaxSuccess(ajaxHandler);

            //Make sure to remove our handler if we ever yield back.
            window.setTimeout(function () {
                jQuery(document).unbind("ajaxSuccess", ajaxHandler);
                if (!initialized) {
                    handleInlinedNonjQuery();
                }
            }, 0);

        }
    } else {
        //We are included.
        alert("Included:" + scripts[scripts.length - 1].src);
        initmywholejsframework();
    }

    //Handle other JS frameworks etc. here, if you will.
    function handleInlinedNonjQuery() {
        alert("nonJQuery");
        initmywholejsframework();
    }

    //Initialize your lib here
    function initmywholejsframework() {
        alert("loaded");
    }

})(jQuery);

【讨论】:

  • 很酷的解决方法。我希望有一种更通用的方法来解决这个问题——但看起来这几乎是最好的。我在上面编辑了我的问题,以显示我对你所写内容的版本。
【解决方案3】:

B T,对不起,如果这没有帮助,但我很好奇你为什么需要这样做?我问的原因是我不明白为什么不能只使用相对文件路径来加载这些文件?可以使用 window.location 找出您所在的位置,但您为什么要这样做呢?至于加载它们,你不能对文件进行ajax调用然后评估它们吗?

【讨论】:

  • 另外,我只记得一种更简单的方法,您可以动态地将脚本元素添加到页面中。以下是如何执行此操作的链接 -> codehouse.com/javascript/articles/external
  • 我正在制作一个旨在由外部域加载的 javascript 库。这不是关于简单 javascript 文件的问题。如果您想了解更多上下文,请参阅以下链接,谢谢:stackoverflow.com/questions/2255689/…
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2011-01-13
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2010-12-27
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多