Jquery文档准备好了函数声明

我想知道为什么下面的代码在根据文档应该做同样的事情时的工作方式不同。http://learn.jquery.com/using-jquery-core/document-ready/

第一个例子：

<script>
    $( document ).ready(function() {
        document.write("And what?");
    });
</script>

第二个例子：

<script>
    $( document ).ready(test());
    function test() {
        document.write("And what?");
    }
</script>

这两个函数之间有什么区别，以及如何使用雅虎YUI获得相同的示例？

document ready和document write不是一回事：

document.ready是一个 jQuery 事件，将在 DOM 完成加载后触发。 document.write 是 JavaScript 的原生函数，它将通过您作为参数发送的值覆盖页面的所有内容。

您显示的 2 个代码之间的区别在于，在第一个代码中，您将函数作为参数发送，而在第二个代码中，您将函数的结果作为参数发送，因为您在包含大括号时调用test。

因此，对于您的代码，问题是在 1 中您在 DOM 准备就绪后调用该函数，而在 2 中您在调用函数时执行该函数。

要在两个代码中获得相同的结果，您应该在第二个示例中将测试函数作为参数发送时删除大括号：

<script>
    $( document ).ready(test);
    function test() {
        document.write("And what?");
    }
</script>

除此之外，您得到的 2 个结果是因为document.write工作的"奇怪"方式。查看解释为什么会发生这种情况的文档。

如果您在文档加载完成后调用document.write()，则浏览器将清除当前页面并开始一个新的空白页面。这就是它的工作方式。所以这个：

<script>
    $( document ).ready(function() {
        document.write("And what?");
    });
</script>

将始终清除页面并开始一个新页面，其中只有"And What?"。

如果在触发之前没有错误地调用 test 函数$(document).ready()则第二个代码示例将生成相同的结果。如果您这样做：

<script>
    $( document ).ready(test);
    function test() {
        document.write("And what?");
    }
</script>

你会得到与上面相同的结果。

相反，当您执行此操作时：

<script>
    $( document ).ready(test());
    function test() {
        document.write("And what?");
    }
</script>

您立即调用test()(它不是在等待文档准备就绪(，然后将其返回值(undefined(传递给$(document).ready()。

若要传递函数引用以便可以调用 LATER，请仅传递函数的名称，后面不带括号。如果在名称后加上括号，则指示 JS 解释立即执行函数并传递返回结果。如果仅传递函数的名称，则传递函数引用，函数稍后可以调用该引用。

相关内容