为啥将 JavaScript 放在页面的页脚中？
Posted
技术标签:
【中文标题】为啥将 JavaScript 放在页面的页脚中？【英文标题】：Why put JavaScript in the footer of a page?为什么将 JavaScript 放在页面的页脚中？ 【发布时间】：2013-04-29 18:31:23 【问题描述】：所以我最近从 ThemeForest 购买并下载了一个模板。我在本地服务器上设置了模板。我使用 codeigniter 生成了具有下拉菜单的导航。我将菜单中的所有内容都正确编码。我只生成了标题并进行了测试，并意识到下拉菜单不起作用。我花了大约两个小时试图找出我的代码出了什么问题。然后我终于意识到 javascript 文件包含在模板的页脚中......我还没有生成。
所以我的问题是……为什么有人会将 JavaScript 文件放在 html 页面的页脚中？我认为 JS 只应该位于文件的标题中。对吧？
【问题讨论】：
***.com/questions/1638670/… 没错，目标是加载页面后加载JS。 【参考方案1】：您可以通过多种方式将脚本文件加载到网页。
但是在页面底部加载脚本有以下优点。
-
不会阻止任何要加载的 DOM 内容。
所有 DOM 元素都可用于正在加载的脚本。
如果您使用第三方库，例如 jQuery，则可以跳过
$(document).ready(function () ...);，因为 DOM 已经加载。
希望这会有所帮助。
【讨论】：
【参考方案2】：Javascript 可以在您页面的任何地方运行。不仅在标题中！
但是，最好将脚本放在底部（在正文结束标记之前）。
脚本导致的问题是它们会阻止并行下载。 HTTP/1.1 规范建议浏览器每个主机名并行下载不超过两个组件。如果您从多个主机名提供图像，则可以同时进行两次以上的下载。但是，在下载脚本时，浏览器不会启动任何其他下载，即使在不同的主机名上也是如此。
阅读全文： http://developer.yahoo.com/performance/rules.html#js_bottom
【讨论】：
【参考方案3】：底部脚本的大问题是页面中间不能有任何脚本（这是动态生成的页面的问题）以及任何要应用于页面上元素的特定于页面的脚本加载到你的库后需要放。例如，如果您需要加载一些 ajax 内容，则只能在加载底部 JS 之后执行此操作。 因此，出于许多原因，人们更喜欢将库至少加载在顶部（头部），然后只将操作 JS 放在脚下
【讨论】：
以上是关于为啥将 JavaScript 放在页面的页脚中？的主要内容，如果未能解决你的问题，请参考以下文章