为什么正文标签末尾的脚本
我知道这个问题被问了很多次，但我还没有找到答案。那么，为什么它建议在body标记的末尾包含脚本以获得更好的呈现呢？
从Udacity课程开始，在DOM和CSSOM准备好之后，https://www.udacity.com/course/ud884呈现就开始了。JS是HTML解析阻塞，任何脚本都是在CSSOM准备好之后启动的。
所以如果我们有：
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>CRP</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<!-- content -->
<script src="script.js"></script>
</body>
</html>CRP将是：
CSSOM ready > JS execute > DOM ready > Rendering如果剧本在头上：
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>CRP</title>
<link rel="stylesheet" href="styles.css">
<script src="script.js"></script>
</head>
<body>
<!-- content -->
</body>
</html>CRP将是相同的：
CSSOM ready > JS execute > DOM ready > Rendering这个问题只是关于“同步”脚本(没有异步/延迟属性)。
回答 7
Stack Overflow用户
发布于 2015-06-04 20:03:03
Stack Overflow用户
发布于 2015-06-04 20:07:45
在我看来，这是一个过时的做法。最近，JavaScript更倾向于将需要DOM的任何代码分离到"DOMContentLoaded“事件侦听器中。这不一定是所有的逻辑；许多代码可以在不访问完整DOM的情况下进行初始化。
的确，这只会导致一个很小的时刻，即只有脚本文件被检索，而没有其他任何内容(例如，图像)。可以通过添加async属性来跳过这个小窗口，但即使没有它，我还是建议将脚本标记放在头上，以便浏览器能够尽快知道加载脚本标记，而不是保存它们(以及将来JS发起的任何请求)。
Stack Overflow用户
发布于 2020-12-26 07:50:53
最好将JavaScript标记放在结束标记之前，而不是放在HTML的部分中。 其原因是HTML从上到下加载。头先装，然后是身体，然后是身体内的所有东西。如果我们将JavaScript链接放在head部分，那么在加载任何一个JavaScript之前，整个JavaScript文件都会加载，这可能会导致一些问题。 1.如果您的JavaScript中有代码可以在JavaScript文件加载后立即修改JavaScript，那么实际上还不会有任何HTML元素对其产生影响，因此看起来JavaScript代码似乎不起作用，您可能会遇到错误。2.如果您有大量的JavaScript，它可以明显地减缓页面的加载速度，因为它在加载任何HTML之前加载了所有的JavaScript。当您将JavaScript链接放置在HTML底部时，它会给HTML在任何JavaScript加载之前加载的时间，这可以防止错误，并加快网站响应时间。 还有一点:虽然最好将Javascript包含在HTML的末尾，但是将Javascript放在HTML中并不总是会导致错误。在使用jQuery时，通常会将所有代码放入“文档就绪”函数中： $(“document”).ready(函数(){ //这里的代码})； 这个函数基本上是说，在文档准备好或完全加载之前，不要在内部运行任何代码。这将防止任何错误，但仍然可以减慢HTML的加载时间，这就是为什么在所有HTML之后仍然最好包含脚本的原因。
https://stackoverflow.com/questions/30653081
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号