网页底部/顶部的 JavaScript？

IT技术 javascript webpage
2021-01-22 19:23:14

我只是使用 Mozilla Firefox 的插件“Yslow”，它告诉我应该将 JavaScript 放在底部。我以前听说过这个，但并没有真正考虑太多。与顶部相比，将 JavaScript 放在网页底部真的有优势吗？

6个回答

它将允许网页在执行 JavaScript 之前明显加载，这对于 Google Analytics 之类的事情很有意义，不需要在页面加载之前发生。

您可能还想查看 jQuery、prototype 等内容并附加到“就绪”处理程序，该处理程序在 DOM 完全加载后执行 JavaScript 代码，这是许多 JavaScript 代码的合适位置。

是的， <script> 标签可以在任何地方，遇到它就会被执行，所以很有可能它之前的所有内容都已经对用户可见（但不能保证）。
2021-03-16 19:23:14
这是否意味着通常位于 <head></head> 标记内的 JavaScript 可以位于页面中 <body> 标记之后的任何位置？
2021-03-20 19:23:14
你甚至不必把脚本放在 html 标签内，你可以把它放在底部的外面，它仍然可以工作......尽管它看起来有点滑稽。
2021-03-21 19:23:14
@NickLarsen，这没有验证。不好的做法。
2021-04-05 19:23:14
在主要使用 jQuery 进行事件驱动之前，我像 vava 和 NickLarsen 提到的那样，到处撒了脚本标签。它们几乎可以位于 HTML 中的任何位置，甚至在 HTML 标记之后。
2021-04-10 19:23:14

假设您没有在 CDN 上运行或没有从单独的子域或服务器为您的 JS 提供服务，它将同步加载并强制您的 HTML 内容等待，直到它下载文件。通过将 JS 放在页面底部的结束</body>标记之前，您允许在加载 javascript 之前解析 HTML。 这提供了更快的页面加载时间的效果。

如果你有静态的 html 内容和大量的 javascript，它可以在感知页面加载时间上产生差异，因为 html 将首先加载，让用户看到一些东西。如果你没有太多的 javascript，或者现有的页面内容依赖于 javascript 是有用的，那么这实际上不是那么有用。

是的，页面将在加载和执行 javascript 之前加载内容并呈现它，因此页面加载速度会更快。

我想更新这个主题，谷歌最近推出了异步截取的http://support.google.com/analytics/bin/answer.py?hl=en&answer=1008080&rd=1可以添加到您的网站，例如谷歌统计支持。它应该放在<head>部分的底部以获得最佳性能。关键是这增加了在用户离开页面之前要发送的跟踪信标的可能性。

如果您想使用您的谷歌分析在谷歌网站管理员工具中验证您的网站，它也应该位于那里。

除此之外，相同的规则基本上仍然适用 - 底部的 javascript 用于“快速”加载页面。我使用引号是因为在 javascript 完成之前我不计算页面完全加载;-)

其它你可能感兴趣的问题
上一篇使用 javascript 更改 SVG 图像颜色 下一篇jQuery 函数从数组中获取所有唯一元素？