Question

如果第三方javascript文件挂起并需要一段时间才能加载，

jQuery(document).ready(function() {})

在被叫之前必须等待加载吗？

Answer 1

是的，它必须等待。特别是，在其他脚本有机会执行之前，您不能依赖jQuery(document).ready()。 ready绑定到DOMContentReady，readystatechanged或onload，无论哪个可用。

文档指出“在大多数情况下，脚本可以在DOM层次结构完全构建后立即运行”。请注意，唯一保证在此事件触发时DOM已准备就绪。 它不能保证你的任何其他东西 - 因为它不能。

例如，在ready()处理程序有机会执行之前， bright.js bright.js 始终被称为无论你如何改变剧本标签：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Test</title>
    <script src="http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.2.js" charset="utf-8" type="text/javascript" ></script>
</head>
<body>
    <script type="text/javascript" >
    // <![CDATA[
        alert("attaching event");
        $(document).ready(function () { alert("fired"); });
    // ]]> 
    </script>
    <script type="text/javascript" src="brilliant.js" ></script>
</body>
</html>

仅供参考，这是jquery-1.4.2的相关代码：

bindReady: function() {
    if ( readyBound ) {
        return;
    }

    readyBound = true;

    // Catch cases where $(document).ready() is called after the
    // browser event has already occurred.
    if ( document.readyState === "complete" ) {
        return jQuery.ready();
    }

    // Mozilla, Opera and webkit nightlies currently support this event
    if ( document.addEventListener ) {
        // Use the handy event callback
        document.addEventListener( "DOMContentLoaded", DOMContentLoaded, false );

        // A fallback to window.onload, that will always work
        window.addEventListener( "load", jQuery.ready, false );

    // If IE event model is used
    } else if ( document.attachEvent ) {
        // ensure firing before onload,
        // maybe late but safe also for iframes
        document.attachEvent("onreadystatechange", DOMContentLoaded);

        // A fallback to window.onload, that will always work
        window.attachEvent( "onload", jQuery.ready );

        // If IE and not a frame
        // continually check to see if the document is ready
        var toplevel = false;

        try {
            toplevel = window.frameElement == null;
        } catch(e) {}

        if ( document.documentElement.doScroll && toplevel ) {
            doScrollCheck();
        }
    }
},

Answer 2

我认为$（document）.ready（）在加载和呈现html文档时运行。阅读文档以获取更多信息

http://docs.jquery.com/Tutorials:Introducing_$(document).ready()

Answer 3

第三方js文件可能正在阻止，特别是如果它位于head标记中。尝试将它放在<body>结束标记之前。

我认为第一个答案是错误的 - document.ready并不意味着必须加载所有内容，这意味着dom已经完成。否则，在此内部运行的jquery方法将无法运行，直到加载了所有图像（例如），这不是真的。

修改

看起来脚本的行为不同，但可以是浏览器特定的。这里有一个很好的解释：

JavaScript: DOM load events, execution sequence, and $(document).ready()

jQuery（document）.ready多久会被调用？

3 个答案: