Question

我目前正在通过Karl Swedberg学习jQuery，其中书中的所有jQuery代码示例都包含在$（document）.ready（）中。

虽然我理解为什么代码必须包含在$（document）.ready（）中，即只有在加载HTML文档时它们才会运行，但本书并没有解释为什么必须放置任何代码在一个函数内部。

E.g

$(document).ready(function(){
    alert("The page has loaded.");
    alert("2nd alert.");
});

在上面的示例中，为什么必须在函数（）中包含警报才能工作，并且不能像下面那样的示例不起作用。

$(document).ready(
    alert("The page has loaded.");
    alert("2nd alert.");
);

如果有人能够启发我，我将不胜感激。

Answer 1

读取Docs，它指定在DOM完全加载时要执行的函数。

.ready（处理程序）

其中，处理程序

类型：功能（）

在DOM准备就绪后执行的函数。

Answer 2

$(document).ready()需要一个功能。您的第二个示例实际上是语法错误，因为alert("The page has loaded."); alert("2nd alert.");不是有效的参数列表。

您通常必须在jQuery中使用$(document).ready()的原因是因为您通常与DOM节点进行交互（如果您的脚本恰好位于页面顶部，那么DOM实际上并不可用）。另一种方法是将您的脚本放在页面底部，此时您需要的所有DOM节点都可用，并且不需要$(document).ready()包装器。

Answer 3

$（document）.ready接受回调。回调是一个javascript函数。 Javascript函数可以像变量一样传递。在上面的例子中，您使用的是内联匿名函数，这是一个没有名称的函数。

您可以像这样重写您的示例：

function doStuff() {
    alert("The page has loaded.");
    alert("2nd alert.");
}

$(document).ready(doStuff);

您需要使用函数，因为您不能将语句作为参数传递给函数，但可以传递函数。

请注意，如果您不想输入那么多的速记符号在功能上是等效的：

$(function() {
    alert("The page has loaded.");
    alert("2nd alert.");
});

或没有内联函数：

function doStuff() {
    alert("The page has loaded.");
    alert("2nd alert.");
}

$(doStuff);

为什么我必须在函数中包含jQuery命令

3 个答案: