DOMContentLoaded事件是否与jQuery的.ready（）函数完全相同？ [英] Is DOMContentLoaded event EXACTLY the same as jQuery's .ready() function?

问题描述

我已经用jQuery的 $（document）.bind（'）替换了 window.addEventListener（'DOMContentLoaded'，function（）{}）; ready'，function（）{}）; ，因为第一个在IE< 9，我不想玩这个虚拟浏览器的 .attachEvent（），如果我可以很好地覆盖jQuery本身。

在更换后不久，我注意到，在页面加载/刷新后，始终触发0-2毫秒的 DOMContentLoaded 事件始终触发（至少这是记录的内容通过我的记录脚本），而 .ready（）始终需要至少15-20毫秒，页面刷新后，再次被触发（再次 - 由脚本记录） / p>

我纯粹要求我的好奇心，为什么会有这么显着的延迟？当然，对我来说没有问题，jQuery在以后触发该事件。只是，因为我想知道所有的答案（统治世界！：]），我不能睡觉了！ ：]

编辑：在 .ready（）功能文档某些用户（Nick（Nexxar））指出：jQuery模拟IE上不存在的DOMContentLoaded事件，但所用机制比其他浏览器上使用的事件晚得多/ EM>。也许这是一样的，我要求吗？

解决方案

假设支持事件的浏览器：

1. 真实事件可以支持任何文档。 jQuery将只使用它加载的文档，无论你传递给它。


2. jQuery将异步触发事件如果事件已经发生。如果事件已经发生，则附加'DOMContentLoaded'事件将不起作用。

这些浏览器没有延迟，请参阅 http://jsfiddle.net/rqTAX/3/ （记录的偏移量为以毫秒为单位）。

对于不支持该事件的浏览器，jQuery的显然也可以为他们工作。它将使用与真正的 DOMContentLoaded 不同的hacky机制，并且不一定会在真实 DOMContentLoaded 会：

  // DOM准备检查Internet Explorer 
函数doScrollCheck（）{
 if（jQuery.isReady）{
 return; 
} 
 
 try {
 //如果使用IE，请使用Diego Perini的技巧
 // http://javascript.nwbox.com/IEContentLoaded/ 
 document.documentElement.doScroll（left）; 
} catch（e）{
 setTimeout（doScrollCheck，1）; 
返回; 
} 
 
 //并执行任何等待函数
 jQuery.ready（）; 
} 
  

I have replaced window.addEventListener('DOMContentLoaded', function() {}); with jQuery's $(document).bind('ready', function() {});, because first one failed to work on IE < 9 and I did not wanted to play with .attachEvent() for that dummy browser, if I could have this nicely covered by jQuery itself.

Shortly after replacement, I noticed that DOMContentLoaded event was always fired around 0-2 miliseconds after page load / refresh (at least this is what was logged by my logging script), while .ready() always requires at least 15-20 miliseconds, after page refresh, to be fired (again - as logged by script).

I'm asking purely for feeding my curiosity, why there is such "significant" delay? Of course, there is no problem for me, that jQuery is firing that event later. It is just, that because I want to know ALL the answers (and rule the world! :]), I can't sleep with that! :]

EDIT: in .ready() function doc some user (Nick (of Nexxar)) points out that: "jQuery simulates the non existing "DOMContentLoaded" event on IE, but the used mechanism fires much later than the event used on other browsers". Maybe this is the same, I'm asking for?

解决方案

Assuming browser that supports the event:

1. The real event can support any document. jQuery will only use the document it was loaded in, no matter what you pass to it.
2. jQuery will fire the event asynchronously even if the event has already happened. Attaching 'DOMContentLoaded' event will do nothing if the event has already happened.

There is no delay in these browsers, see http://jsfiddle.net/rqTAX/3/ (the offsets logged are in milliseconds).

For browsers that don't support the event, jQuery's will obviously work for them as well. It will use a hacky mechanism that is not the same as the real DOMContentLoaded and will not necessarily fire as soon as the real DOMContentLoaded would:

// The DOM ready check for Internet Explorer
function doScrollCheck() {
    if ( jQuery.isReady ) {
        return;
    }

    try {
        // If IE is used, use the trick by Diego Perini
        // http://javascript.nwbox.com/IEContentLoaded/
        document.documentElement.doScroll("left");
    } catch(e) {
        setTimeout( doScrollCheck, 1 );
        return;
    }

    // and execute any waiting functions
    jQuery.ready();
}

这篇关于DOMContentLoaded事件是否与jQuery的.ready（）函数完全相同？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！