Jquery - 我可以将我的jquery代码放在html主体末尾的脚本中吗？

Question

如果我将jquery代码放在</body>标记之前，那么DOM肯定会准备好吗？

我有一些jquery代码，当我把它放在$ .ready（）函数中时，我可以在javascript代码运行之前看到页面的样子。

但是，如果我将代码放在</body>标记之前，那么我只能看到运行javascript后页面的样子。我使用计时器来查看时间差，并且在</body>结束之前执行的代码比$ .ready中的代码早300ms执行。

编辑：如果我在</body>标记之前调用我的代码时DOM已经准备就绪，那么将我的代码放在$ .ready中有什么好处，考虑到如果我之前把它放在我的javascript中会更快执行</body>？

Answer 1

是的，到那时DOM已经准备就绪，但您仍然不能确定您没有看到页面的闪存处于原始状态。

如果您从头开始在页面中看不到某些内容，则可以在样式表中使用CSS来隐藏它，而不是使用jQuery隐藏它。这样你就可以确保在你有机会隐藏它们之前不会闪现元素。

Answer 2

是的，此时DOM已准备就绪。来自Google Closure Library邮件列表的This thread可能会引起关注，但遗憾的是据我所知他们没有跟进实际的文章。来自该主题的Erik Arvidsson的一些引用：

  

简短的故事是我们不想等待DOMContentReady（或者更糟   加载事件）因为它会导致糟糕的用户体验。

和（关于脚本元素正上方的DOM元素是否真的存在）

  

DOM节点在那里，如果你查询它的大小或其他东西   需要回流才会发生回流，以便布局数据   最新的。

进一步说明：

• 如果可以，请从页面上的图像等（从子域或静态服务等）加载不同（明显）主机的JavaScript文件;否则，即使您没有等待“加载”事件，您的JavaScript文件仍将位于下载队列的末尾。您可能会发现，如果它位于队列末尾并且您正在等待它，则会获得更多闪烁而不是更少闪烁。 （请记住，HTTP 1.1规范建议同时从给定主机下载不超过两个项目，并且大多数浏览器 - 以及一些服务器 - 强制执行此操作。）
• 与此相关，您可以考虑为自己的脚本（以及其他资源使用CDN服务，但请务必将它们分散到不同的明显主机名中。
• DOM已准备就绪，但（自然地）并非所有图像都是如此。
• 您可以使用页面中包含的CSS将主体的背景颜色设置为尽可能与生成的渲染页面的主色完全匹配，从而最大限度地减少明显的闪烁（以避免在获取CSS时出现延迟）。
• 对于面向公众的网站，如果您可以避免依赖jQuery进行页面的基本呈现，那可能是最好的，因为不是每个人都会启用JavaScript。当然，如果您的目标受众更像StackOverflow，那么您可能会认为他们会成为胜利者。 ： - ）
• 如果你使用像谷歌Ajax Libraries stuff这样的CDN的jQuery，你的目标用户在第一次访问你的网站时加载它的几率会有所提高，最大限度地减少代码运行前的延迟（例如，jQuery时）正在加载）。

Answer 3

我99％确定它可以在<script>标记之前存在的DOM上运行。这意味着，如果它在</body>之前，它将起作用。

我很想知道在结束</script>之后它是否曾在某事上发挥作用。就像互联网加载页面的速度可能比处理器启动JavaScript代码的速度快...我怀疑它是否因为如果你做document.write，它应该与<script></script>处于同一点。