javascript - $(document).ready 和编写打开的 jQuery 语句之间的区别

Question

编写代码有和没有有什么区别$(document).ready？

例如：

$(document).ready(function() {
    $("#button").click(function() {
        //Code
    });
});

和：

$("#button").click(function() {
    //Code
});

和 ：

 <input id="button" type="button" value="Cancel" onclick="hidedropdown()" />

    function hidedropdown() {
        //Code
}

Answer 1

在第一种情况下，在 DOM 准备好之前不会执行代码。

请参阅文档：

传递给 .ready() 的处理程序保证在 DOM 准备好后执行，因此这通常是附加所有其他事件处理程序和运行其他 jQuery 代码的最佳位置。

如果您在script位于 HTML 开头或标题中的button元素中执行第二个代码，则不会找到这些元素并且不会绑定任何事件处理程序。使用.ready修复。

出于同样的原因，将脚本放在页面底部（与 相邻</body>）也可以解决此问题 - 解析脚本时，HTML 将转换为 DOM，您可以遍历它。