Question

我有以下代码将函数附加到DOMContentLoaded事件，但该函数从未在Internet Explorer 11中调用

代码：

if (document.addEventListener) {
   document.addEventListener("DOMContentLoaded", init, false);
}
else {
   document.attachEvent("onDOMContentLoaded", init);
}

Answer 1

有几个原因可能不会触发：

它已经被解雇了（在您附加事件处理程序之前）并且您错过了它。
您正在运行不支持DOMContentLoaded事件的旧版IE。
在这些代码行之前存在某种脚本错误，因此这些代码行实际上并未执行，因此事件处理程序从未实际注册过。
您尝试在嵌入式iFrame上执行此操作，但可能没有iFrame的正确文档（某些浏览器可以在加载外部源时切换文档）。

要检查脚本错误，您应该在IE中打开调试控制台（按F12）并查看控制台以查看是否报告了任何脚本错误。

您可以查看document.readyState === "complete"是否已被解雇。

而且，在IE9之前的IE版本中，您需要attachEvent，IE不支持DOMContentLoaded，因此您的其他分支将无效。您必须在那些旧版本的IE中使用不同的检测方法。

您可以看到经过良好测试的跨浏览器简单javascript函数，以便在文档准备就绪时收到通知：pure JavaScript equivalent to jQuery's $.ready() how to call a function when the page/dom is ready for it。

Answer 2

通过一个可行的例子来解决这个问题，见下文。我发现的问题是DOMContentLoaded不会为javascript触发，除非事件是在文档内部内联创建的。

一个简单的解决方案是在文档readyState中添加一个检查。如果它仍在加载 - 创建事件，因为DOMContentLoaded可能会触发 - 否则只需立即加载，因为DOM已准备就绪。

var load = function () {
    console.log('I will always load, woohoo');
};

if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', load); // Document still loading so DomContentLoaded can still fire :)
} else {
    load();
}

Javascript DOMContentLoaded事件未在Internet Explorer中触发

2 个答案: