问Requirejs domReady插件与Jquery $(文档).ready()？

EN

似乎所有的关键点都已经被击中了，但是一些细节从裂缝中消失了。主要是：

domReady

它既是一个插件，也是一个模块。如果将其包含在需求数组w/ a后面的!中，则在交互w/ DOM“安全”之前，您的模块才会执行：

define(['domReady!'], function () {
    console.info('The DOM is ready before I happen');
});

请注意，加载和执行是不同的；您希望您的所有文件尽快加载，这是执行内容是时间敏感的。

如果省略了!，那么它只是一个正常的模块，恰好是一个函数，它可以接受一个回调，在DOM安全地与其交互之前不会执行这个回调：

define(['domReady'], function (domReady) {
    domReady(function () {
        console.info('The DOM is ready before I happen');
    });
    console.info('The DOM might not be ready before I happen');        
});

使用domReady作为插件时的优势

依赖于依赖于domReady!的模块的代码有一个非常重要的优势:它不需要等待DOM准备就绪！

假设我们有一个代码块，A，它依赖于一个模块，B，它依赖于domReady!。在DOM准备好之前，模块B不会完成加载。反过来，在B加载之前，A不会运行。

如果要将domReady作为B中的常规模块使用，则A还必须依赖于domReady，并将其代码包装在domReady()函数调用中。

此外，这意味着domReady!与$(document).ready()享有同样的优势。

关于domReady和$(document).ready()之间的区别

两种方法都可以探测DOM是否已经/什么时候准备好了，基本上是一样的。

我们害怕jQuery在错误的时间开火

jQuery将触发任何现成的回调，即使DOM在jQuery加载之前加载(您的代码不应该关心首先发生的事情)。

试图回答你的主要问题：

当我们可以使用jquery的requirejs的$(document).ready();时，为什么要提供domReady插件呢？

他们做了两件不同的事，真的。RequireJS的domReady依赖性意味着该模块需要在运行DOM之前完全加载它(因此可以在应用程序中的任意数量的模块中找到它，如果您愿意的话)，而$(document).ready()则在加载DOM时触发它的回调函数。

这种区别可能看起来很微妙，但请想想看:我有一个模块需要以某种方式耦合到DOM，所以我可以依赖domReady并在模块定义时将其耦合起来，或者在模块的末尾放置一个$(document).ready()，并对模块的init函数进行回调。我会说第一种方法更干净。

同时，如果我有一个需要在DOM准备就绪时正确发生的事件，那么$(document).ready()事件就是开始，因为这并不特别取决于加载模块的RequireJS，前提是满足您从其中调用它的代码的依赖关系。

同样值得考虑的是，您不一定将RequireJS与jQuery结合使用。任何需要DOM访问(但不依赖于jQuery)的库模块通过使用domReady仍然是有用的。

按外观顺序回答子弹：

• 他们都完成了同样的任务
• 如果您出于任何原因对jquery有保留，那么使用domReady
• 正确，所以只需使用jQuery
• 因为不是每个人都使用jQuery
• 我同意，就用jQuery吧
• 插件的定义是“满足需求”。
• 跨浏览器ajax不是一件事。跨域？可能有，如果没有，那就没有必要喂食了。
• ，-好的

当它归结到它，你是过度考虑这一点。它是一种在domReady上执行javascript的机制。如果你没有jQuery，我会支持domReady插件。因为您有jQuery，所以不要加载更多的脚本来执行已经可用的事情。

清晰度更新

当文档“准备好”时调用的domReady插件collects functions。如果它已经加载，那么它们将立即执行。

JQuery收集函数并将一个deferred object绑定到“就绪”的位置。当dom准备就绪时，延迟对象将被解析，函数将被触发。如果dom已经“就绪”，那么延迟将被解决，因此函数将立即执行。

这意味着他们实际上也做了同样的事情。