jquery - 我是否需要将 application.js 中的每个 Javascript 函数都包含在 $(function() {} 中？

Question

我的application.js在外面有这个:

$(function() {
    // My functions are in here, and some of them even work.
}

我剪切并粘贴直到得到一些有用的东西，现在我正在认真学习 jQuery。我知道有点落后。

上面代码的目的是什么，$(function() { }？

Answer 1

这是一个 shortcut for :

$(document).ready(function () {

});

这意味着一旦 DOM 完全加载，您的脚本就会运行。这意味着脚本中依赖于现有某些 DOM 节点的任何部分都可以工作。如果您的 .js 文件位于页面顶部，它将在 DOM 节点存在之前执行，这意味着您将尝试使用不存在的东西。 $(document).ready()允许您推迟代码的执行，直到页面准备就绪。

例如，假设您有以下 JavaScript，已加载到 head 的脚本标记中:

$('a').click(function () {
    alert("You can't leave!!!");
    return false;
});

尝试向所有 <a> 添加点击处理程序标签，但没有 <a>标签还没有，所以它不会做任何事情。如果你把它包裹在 $(document).ready() 中它看起来像这样:

$(document).ready(function () {
    $('a').click(function () {
        alert("You can't leave!!!");
        return false;
    });
});

现在只有当文档准备好时才会执行。

要回答标题中的问题，不，您不必将所有内容都包含在 $(document).ready() 中。 - 只是依赖于 DOM 完全加载的代码。