我对 Web 开发并不陌生，当我在互联网上搜索其他主题时，我看到很多人将流行的 JS 库放在他们网站的不同位置。
例如:在 的最开始或开头 插入 JS 库 <head> </head> <强>部分。 (在加载任何 JS 代码或 CSS 文件之前)
例如:在 的末尾插入 JS 库 <head> </head> <强>部分。 (加载所有 JS 代码和 CSS 文件后)
例如:在 的末尾插入 JS 库 <body> </body> <强>部分。 (加载所有 JS 代码、文本、图像、视频、CSS 文件等后...)
所以我的问题是这样的。
将以下 JS 库、插件和 CSS 样式表插入(在何处)到网页以获得最快的加载时间和其他优势的最佳做法是什么？ - 请说明原因 -
JQuery 及其插件
引导 3.js
Modernizr.js
Angular.js
还有另一个我不能在这里提及的广泛使用的 JS 库......
规范化.css
重置.css
bootstrap.css + 更多内容
谢谢你..!
最佳答案
没有所谓的“标准”方法。选择将线条放在哪里归结为一个问题:我什么时候需要图书馆？
你看，网页文件是逐行加载的，让我们以下面的例子来说明我的意思:
<script>
document.getElementById("target").innerHTML = "changed"
</script>
<p id="target">unchanged</p> #target没有改变，因为脚本是在元素加载之前加载的。 Web 文件按程序加载。加载 JavaScript 行时。它会立即执行，但目标元素不会。所以它不能改变元素。
即使使用 jQuery，也存在同样的问题:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$("#target").text("changed");
</script>
<p id="target">unchanged</p>因此，我们经常使用$(function(){}) .
回到加载问题
把他们的人 <script>标签或 <link> body (前面)或头部的标签，想要立即执行脚本，有时他们不会使用 $(function())或 document.onload
把他们的人 <script>标签或 <link>正文中的标签(最后)想要确保加载所有元素，然后执行脚本或加载 CSS。
结论
应该先加载jQuery等独立资源，再加载jQuery插件等依赖资源。然后您尝试决定何时开始加载资源，然后将这些行放在适当的位置。
您应该将 CSS 链接放在 <head> 中标记，因为您不希望访问者在加载 CSS 文件之前看到未设置样式的内容。
如果您不能决定或不关心时间，请将每个 <script>和 <style> <head> 中的标签.
这是您可能感兴趣的另一篇文章:Load and execution sequence of a web page?
关于javascript - 在我的 HTML 代码中的何处插入 JavaScript 库和 CSS？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34702909/