Jquery文件准备好了函数声明？

Question

我想知道为什么下面的代码在根据文档应该做同样的事情时工作方式不同。 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>

• 它实际上返回页面的内容“和什么？”在它结尾，所以它附加文本，但为什么？！

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

Answer 1

document ready和document write不是一回事：

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

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

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

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

<script>
    $( document ).ready(test);

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

除了这个有点不同之外，你得到的2个结果是因为document.write的“奇怪”方式。查看documentation，它解释了为什么会发生这种情况。

Answer 2

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

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

将始终清除该页面并开始一个只有"And What?"的新页面。

---

如果您在$(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）传递给{{1 }}。

要传递一个函数引用，以便它可以被称为LATER，那么在它之后只传递函数的名称而不用parens。如果在名称后面加上parens，则指示JS解释立即执行该函数并传递返回结果。如果只传递函数的名称，则传递一个函数引用，该函数可以稍后调用。