就在前面:该项目不使用JQuery。

我们有一些第三方JavaScript;它又大又有毛,不需要经常使用,因此我们仅在需要时才动态加载它:

function loadBigHairyCode()
{
    var file = document.createElement('script')
    file.setAttribute("type","text/javascript")
    file.setAttribute("src","path/to/big/ugly/script/file.js")
    document.getElementsByTagName("head")[0].appendChild(file)

    magic_needs_to_happen_here
}


脚本加载工作正常,包括一些未在此处显示的相应CSS。

加载的文件定义了一个构造函数(称为UglyGlobalFunc),我们通常在其他地方使用该函数(var foo = new UglyGlobalFunc(....))。问题是,由于该文件的其余部分有点丑陋,因此我们需要对其进行一些修复,以使它的吸取量减少。具体来说,在上面显示“魔术需要在此处发生”这一点上,我想写成等价于

UglyGlobalFunc.prototype.BodgeBodgeBodge = function() {....}


就像我在编辑基础文件一样。

但这失败了,因为此时在代码中,UglyGlobalFunc是未定义的,这是有道理的。对于简单的间接级别(如window.UglyGlobalFunc.proto...)也是如此。所以我的问题是:


在执行的那一刻(需要发生魔术的地方),甚至可以访问动态加载的内容吗?还是直到loadBigHairyCode()返回并且浏览器经历某种刷新周期后它们才变为“真实”?
如果是,那么我该如何访问它们?某种getGlobalVariableByName(“ string”)函数?
如果没有,那么... aieee。普通的理智的人如何去做这种事情?

最佳答案

你可以试试这个

function loadBigHairyCode()
{
    var file = document.createElement('script')
    file.onreadystatechange= function () { // works in IE
        if (this.readyState == 'complete') MyFunc();
    }
    file.onload= MyFunc;
    file.type="text/javascript";
    file.src="path/to/big/ugly/script/file.js";
    document.getElementsByTagName("head")[0].appendChild(file)
}

function MyFunc(){
    //....
}


更新:You may read this

09-10 02:33
查看更多