Question

我理解jQuery，我只是想问，这两个代码示例之间的区别（我知道，它会做同样的事情，但我很好奇，如果第二个例子有特定的东西。

示例1：

$(document).ready(function() {
    // some code #1
    // some code #2
    // some code #3
});

以下是一个地方的所有JS。

示例2：

$(document).ready(function() {
    // some code #1
});

$(document).ready(function() {
    // some code #2
});

$(document).ready(function() {
    // some code #3
});

这些函数（DOM就绪）放在不同的JS文件中。

我只是想，它将如何处理，但我想它会在加载DOM之后执行，然后按顺序执行，如何在HTML中调用它。

Answer 1

传递给$(document).ready()的每个单独函数将为变量和函数创建自己的范围，这可能会产生相当大的差异。拿这两个例子：

$(document).ready(function() {
    function viewEvent(event) {
        console.log(event);
        return false;
    }

    $('a').on('click', viewEvent);
    // works fine, clicking on an <a> element will log the event object
});

然后：

$(document).ready(function() {
    function viewEvent(event) {
        console.log(event);
        return false;
    }
});


$(document).ready(function() {
    $('a').on('click', viewEvent);
    // won't work, viewEvent is out of scope here
});

Answer 2

将按照绑定的顺序调用多个文档就绪处理程序。一般来说，我会建议只让一个人保持整洁，除了......

“这些函数（DOM就绪）位于不同的JS文件中。”

这是我能想到拥有多个现成处理程序的最佳理由。

“我只是想，它将如何处理，但我想它会在加载DOM之后执行，然后按顺序执行，如何在HTML中调用它。”

这是正确的。

Answer 3

您可以根据需要拥有尽可能多的内容，并且将按照执行$()或$(document).ready()函数的顺序执行它们。（即每个处理程序都被添加到队列中）。

Answer 4

我想它会在加载DOM之后执行，然后按顺序执行，如何在HTML中调用它。

这是正确的。

这些函数将按照它们附加到DOM就绪事件的顺序进行堆叠并称为线性函数。

我有多少$（document）.ready（）有什么区别吗？

4 个答案: