我希望不言自明。
答案 0 :(得分:8)
您的jQuery选择器会随机错过任何元素,因为它尚未加载(由浏览器提供)。
答案 1 :(得分:3)
$(document).ready()是jQuery确保您希望在页面加载时运行的代码跨浏览器同时运行的方式。
它还提供了一种机制来堆叠不同的函数以在页面加载时运行。如果您不使用它并且您有多个onLoad分配,则只会添加最后添加的内容。
答案 2 :(得分:2)
这是第一个了解jQuery的事情:如果你想让一个事件在你的页面上运行,你应该在$(document).ready()函数中调用它。一旦加载DOM并加载页面内容,它内部的所有内容都将加载。
$(document).ready(function() {
// put all your jQuery goodness in here.
});
$(document).ready()函数比其他使事件工作的方式有很多优点。首先,您不必在HTML中添加任何“行为”标记。您可以将所有JavaScript / jQuery分离到一个单独的文件中,在该文件中,它更容易维护,并且可以避开内容。当我将鼠标悬停在链接上时,我从未想过在状态栏中看到所有这些“javascript:void()”消息。当您将事件直接附加到标记内时,会发生这种情况。
在某些使用传统JavaScript的网页上,您会在代码中看到“onload”属性。这个问题是它仅限于一个功能。哦是的,它再次为内容添加了“行为”标记。 Jeremy Keith的优秀书籍DOM Scripting向我展示了如何为单独的JavaScript文件创建addLoadEvent函数,该文件允许在其中加载多个函数。但它需要相当数量的代码来完成相当简单的事情。此外,它会在窗口加载时触发这些事件,这使我获得$(document).ready()的另一个优势。
使用$(document).ready(),您可以在加载窗口之前加载或触发事件或者您希望它们执行的操作。您在括号内的所有内容都准备好尽早开始 - 只要浏览器注册DOM,就可以在用户第一次看到页面元素时立即隐藏和显示效果以及其他内容。
引自http://docs.jquery.com/Tutorials:Introducing_ $(文件).ready()
答案 3 :(得分:1)
当您在DOM中选择元素时,它们有时会起作用,但有时它们不起作用。
这取决于它们是否已装载。
但是,如果你在文档的最后放入脚本,它通常是可以的。 (因为在那个时间点它应该已经加载了所有东西)。
答案 4 :(得分:1)
Bassicly使用这个基本规则:
如果您的代码涉及DOM将您的代码包装在$(document).ready()中。如果它不涉及DOM,则不要将其包装在$(document).ready()
中答案 5 :(得分:1)
使用
有两个主要原因$(document).ready (function ()) // or $(function ())
1)它确保只有在DOM完全加载后才能运行其中的代码(这不包括加载图像,flash或其他资源,只包括从HTML构建的DOM)。这意味着您可以将javascript放在HTML中的任何位置而不是底部(使用vanilla javascript是唯一可以保证它可以保证它可以在整个DOM上工作而不是当前加载的地方)。除非你使用window.onload事件,这也保证了这一点,但只能使用一次。这让我想到了第二点;
2)它允许你在页面加载时启动多个功能,而不是在使用vanilla javascript时单独使用window.onload。这很好,因为这意味着你不必a)编写你自己的函数来处理它,b)担心检查是否已经有来自另一个库的onload函数,c)花费多年的调试感觉只是发现你的window.onload已经被其他人的代码覆盖了。
奖励点:3)它看起来很酷,不是吗? :P
其他说明:如果您没有使用或操作DOM,那么您的代码不需要进入$(document).ready()函数。
将您的javascript文件放在html的底部,就在< / body>之前将加载spead的感知增加 - 它实际上并不快,但浏览器将在HTML之后加载JS,因此可以在JS加载时开始呈现HTML。这反过来意味着某些内容将比< head>中的脚本早一秒出现在用户的屏幕上。 - 在网络上,分秒数:)
答案 6 :(得分:0)
嗯,如果它没有被包装,它只是普通的旧JavaScript,用它做你想要的,但是jQuery库会加载,很难说。
答案 7 :(得分:-2)
当脚本从浏览器到浏览器,页面到页面运行时,这将是不可预测的。