如果我将 JavaScript 代码放在底部或将 JavaScript 代码放在 <head> 中里面document.ready , 都是一样的吗？
我对这两种方法感到困惑，http://api.jquery.com/ready/和 http://developer.yahoo.com/performance/rules.html#js_bottom .
将 JavaScript 代码放在底部(就在 </body> 之前)是否有任何好处，即使我将代码放在里面也是如此。
$(document).ready(function() {
// code here
});
因为 JavaScript 附加在
<head>
<script type="text/javascript" src="example.js"></script>
</head>
最佳答案
一般来说，您应该将 Javascript 文件放在 HTML 文件的底部。
如果您使用“经典”，这一点就更重要了 <script>标记文件。大多数浏览器(甚至是现代浏览器)都会阻止 UI thread因此，您的 HTML markup 的渲染过程在加载和执行 javascript 时。
这反过来意味着，如果您在页面顶部加载了相当数量的 Javascript，用户将在“缓慢”加载您的页面时过期，因为他将在<之后看到您的整个标记 您的所有脚本都已加载并执行。
让这个问题更糟的是，大多数浏览器不会以并行模式下载 javascript 文件。如果你有这样的事情:
<script type="javascript" src="/path/file1.js"></script>
<script type="javascript" src="/path/file2.js"></script>
<script type="javascript" src="/path/file3.js"></script>
您的浏览器会
- 加载 file1.js
- 执行file1.js
- 加载file2.js
- 执行file2.js
- 加载file3.js
- 执行file3.js
在这样做的同时，UI thread并且渲染过程被阻塞。
有些浏览器像 Chrome终于开始以并行模式加载脚本文件，这使得整个问题变得不那么严重了。
“解决”该问题的另一种方法是使用 dynamic script tag insertion .这基本上意味着你只能通过 <script> 加载一个 javascript 文件。标签。此(加载程序)脚本然后动态创建 <script>标签并将它们插入到您的标记中。它以异步方式工作并且更好(在性能方面)。
关于javascript - 如果我将 JavaScript 保留在底部或将 JavaScript 保留在 document.ready 中的 <head> 中，两者是一回事吗？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/3921727/