就在前面:该项目不使用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。