通过函数加载 Javascript 动态脚本...如何重新执行 onload 或 readyState？答案

【问题标题】：Javascript dynamic script loading via functions... how to do onload or readyState all over again?通过函数加载 Javascript 动态脚本...如何重新执行 onload 或 readyState？
【发布时间】：2015-09-29 15:16:35
【问题描述】：

目前，我有一个 javascript 可调用函数（不添加全局变量），将脚本添加到头部。

Onload 对于网站最初加载后的页面很有用，但我正在等待加载更大的脚本，直到需要它们，考虑到许多脚本不需要它们。

以下代码适用于某些脚本，但不适用于一些较大的脚本...

function include(script) {
    var head= document.getElementsByTagName('head')[0];
    var newScript= document.createElement('script');
    newScript.type= 'text/javascript';
    newScript.src= script;
    head.appendChild(newScript);
}
function doThething(){
    include('foo');
    include('bar');
    if(document.readyState === "complete") {
        // do something needing foo and bar
    } else {
        window.addEventListener("onload", function () { 
            // do something needing foo and bar
        }
    }
}

使用一些脚本，上面的工作正常且花花公子。对于其他人（尤其是客户端没有的较大的人），它会尝试在 foo 加载之前执行。我无法更改 foo 因为它是一个更大的场外公共图书馆。

如何让 dom 等待新内容完成加载并再次启动 onload，或者确保在我做事之前加载 foo？

【问题讨论】：

'onload' handler for 'script' tag in internet explorer的可能重复
@MikeMcCaughan 上面的问题在标题中是关于 IE 的，仅从标题来看。虽然它确实有相关信息。相关，但不重复。
还应该指出，链接到部分中的解决方案添加了一些全局变量，这是给定示例没有做的事情（也是我一直试图避免的事情......道歉因为没有让这一点更清楚。我正在尝试通过更模块化的可调用函数来做到这一点。）
我不认为该问题与其他问题重复，但我认为该问题的答案（我已在下面链接）是相关的。你试过了吗？
@Chris 我仍在试图弄清楚如何对其进行修改以将其纳入我更大的项目中以进行测试并发挥作用。照原样，由于外部函数全局变量，对我来说不太适用。

标签： javascript dom onload dynamic-loading

【解决方案1】：

您需要的是脚本 onload，而不是文档 onload。在此处查看接受的答案：

'onload' handler for 'script' tag in internet explorer

这是值得佩服的代码：

var head = document.getElementsByTagName("head")[0] || document.documentElement;
var script = document.createElement("script");
if ( s.scriptCharset ) {
    script.charset = s.scriptCharset;
}
script.src = s.url;

// Handle Script loading
    var done = false;

// Attach handlers for all browsers
script.onload = script.onreadystatechange = function() {
    if ( !done && (!this.readyState ||
            this.readyState === "loaded" || this.readyState === "complete") ) {
        done = true;
        jQuery.handleSuccess( s, xhr, status, data );
        jQuery.handleComplete( s, xhr, status, data );

        // Handle memory leak in IE
        script.onload = script.onreadystatechange = null;
        if ( head && script.parentNode ) {
            head.removeChild( script );
        }
    }
};

// Use insertBefore instead of appendChild  to circumvent an IE6 bug.
// This arises when a base node is used (#2709 and #4378).
head.insertBefore( script, head.firstChild );

【讨论】：

“s”在哪里定义？