Question

问题在于http://labjs.com - 一个非阻塞JavaScript加载和依赖项管理的真棒库。

我已经阅读了文档，但我一定太累了或者什么 - 我找不到关于DOM ready事件的任何内容。在DOM准备好之后是否执行脚本？

也许如果我这样做：

$LAB.script('my-library.js').wait(function(){ 
  // interacting with DOM 
});

安全吗？或者我应该使用某种$(function() {})等？

Answer 1

默认情况下，任何脚本加载器都会从页面的DOM-ready和onload事件中解除脚本加载的阻塞，至少是通过intent / definition。

所以，直截了当的答案是，NO，LABjs不会阻止脚本执行，直到DOM就绪。 LABjs加载的一些脚本可以在DOM-ready之前运行，而其他脚本可以在DOM-ready之后运行。

如果您真的遇到代码需要等待DOM的情况，您应该使用像jQuery这样的框架并使用其内置的DOM-ready包装器$(document).ready(...)来使该逻辑DOM准备就绪。

但是，有很多情况下人们认为他们需要等待DOM准备就绪，而他们确实没有：

大多数人将DOM-ready与“所有脚本都已完成加载”混为一谈。如果您只是在等待DOM-ready，因为您需要确保所有脚本都已加载，这是一个错误且不正确的假设。相反，使用脚本加载器的工具来确定何时加载所有脚本，并在适当的时间运行它们，而不管DOM加载如何。使用LABjs，就像将所有脚本放在一个$ LAB链中一样简单，并且在链的末尾有一个最终.wait() - 您可以放心，.wait()中的代码在所有脚本加载并运行之前，回调将不会运行。
大多数人认为他们需要等待DOM-ready执行诸如附加事件处理程序或触发Ajax请求之类的事情。这也是一个不正确的假设。如果您的代码只是在DOM中查询要附加事件处理程序的元素，或者如果您根本不对DOM执行任何操作，而是进行Ajax调用，请不要将逻辑包装在DOM就绪的包装器中。
另一方面，很多人都认为如果你的代码在body标签的末尾运行，那么你就不需要等待DOM-ready。错误。无论在何处指定代码，DOM-ready都可以使用DOM。

通常，您的代码真正需要包装在DOM-ready包装器中的唯一时间是它是否要修改DOM。否则，不要等待DOM-ready运行代码。对于包裹什么和不包装什么都要聪明。

Answer 2

如何使用jQuery令人敬畏的Deferred对象？这就像一个魅力：

var waitThenLaunch = function() {
    var deferredDocReady = $.Deferred();
    $(document).ready(function() {
        deferredDocReady.resolve();
    });
    var deferredScriptsReady = $.Deferred();

    // Load your last remaining scripts and launch!!!
    $LAB.script('last.js').wait(function(){ deferredScriptsReady.resolve(); });

    $.when(deferredDocReady, deferredScriptsReady).done(function() { launchApp(); });
};
$LAB.script('jquery.min.js')
    .script('another_script.js')
    .script('another_script.js').wait()
    .script('another_script.js')
    .script('another_script.js').wait(function(){ waitThenLaunch(); });

在此处找到一个很好的解释：http://www.erichynds.com/jquery/using-deferreds-in-jquery/

Labjs是否推迟了已加载脚本的执行直到DOM准备好了？

2 个答案: