影响某些元素的jQuery函数是否必须存在于代码中的元素之后？

Question

我遇到了一个问题，我的jQuery函数只有在关闭body和html标签之前存在于页面的最底层时才能正常工作。影响某些元素的函数的标准是否必须在这些元素之后？

Answer 1

是的，否则元素还没有在DOM中。

常见的解决方案是通过DOM ready事件执行代码：

$(document).ready(function() {
    // your code
});

还有一种快捷语法（我不会使用它，因为它不太清楚）：

$(function() {
    // your code
});

Answer 2

您需要等待文档加载才能开始操作DOM。

$(document).ready(function() { /* ... */ });

或者更简洁：

$(function() { /* ... */ });

Answer 3

实际上，如果您的函数取决于要加载的元素的样式和属性，则必须使用

window.onload = function () { /* actions to do after page elements loaded */ };

例如，使用HTML5画布就是这种情况 - 画布及其中的svg元素（及其属性）必须首先加载，然后才能对它们进行操作。

在jQuery中，

$(document).load(function() { /* actions to do after page elements loaded */ });

也应该这样做。

当然，如果您的javascript只需要准备好DOM（并且不依赖于要加载的页面元素的属性），那么您可以使用

$(function() { /* actions to do after DOM is ready */ });