document.attachEvent() 在 IE8 中不工作

Question

我知道在 Internet Explorer（IE9 之前的版本）中您不能使用 document.addEventListener()，而必须使用 document.attachEvent。我遇到的问题是 document.attachEvent('onload', AddExternals); 什么都不做。在控制台中，输出应如下所示：

- document.attachEvent - Adding Externals... - jQuery loaded!

但是在 IE8 中，控制台输出是：

下面的代码中会出现这种情况有什么明显的原因吗？

if (document.addEventListener) {                    
    console.log("document.addEventListener")
    document.addEventListener("DOMContentLoaded", AddExternals);
} else if (document.attachEvent) {                  
    console.log("document.attachEvent")
    document.attachEvent("onload", AddExternals);
}

function AddExternals(){
    console.log("Adding Externals...");
    var jq = document.createElement("script");
    jq.type = "text/javascript";
    document.getElementsByTagName("head")[0].appendChild(jq);   
    jq.onload = function(){console.log("jQuery loaded!")};
    jq.src = "https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js";

}

编辑

我已经更改了 document.attachEvent("onload", AddExternals)，现在控制台正在输出 document.attachEvent 和 Adding Externals... 但函数从未完成？

Answer 1

据我所知，没有document.onload事件。相反，您将使用 window.onload 作为后备。您可能还必须测试文档状态以确保它尚未加载（例如事件已经触发）。

要了解文档何时在任何级别的浏览器中准备就绪的完整测试功能，请参阅此之前的代码 question/answer：pure JavaScript equivalent to jQuery's $.ready() how to call a function when the page/dom is ready for it

请记住，旧版本的 IE 没有 .onload 脚本标记，因此您不一定会看到该控制台消息，但您的脚本仍应加载。有一个更复杂的方案可以让您在此处为旧版本的 IE 加载它时得到通知：javascript notify when script is loaded dynamically in IE

我建议您将脚本更改为：

function AddExternals(){

    var doneLoad = false;
    function onload() {
        if (!doneLoad) {
            doneLoad = true;
            console.log("jQuery loaded!")
        }
    }

    console.log("Adding Externals...");
    var jq = document.createElement("script");
    jq.type = "text/javascript";
    jq.onload = doneLoad;
    jq.onreadystatechange= function () {
        if (script.readyState == "loaded" || script.readyState == "complete"){
            doneLoad();
        }
    };
    jq.src = "https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js";
    document.getElementsByTagName("head")[0].appendChild(jq);   

}

相关变更：

1. 添加了对了解脚本加载时间的旧方法的支持。
2. 确保没有重复的加载通知，因为监听了多种机制
3. 在插入脚本标签之前设置.src。