- base::浏览器网页进程, html基本框架
- 希望
DOM还没加载必须需要先加载的 js 会放置在<head>中，有些加了[use::defer属性]、[use::async属性]的<script>也会放在<head>中。 - 一般的script标签都需要等待DOM完全构建完成，即需放在
body最后面
为什么把 <script> 标签放到 <body> 的底部
将 <script> 标签放置在 HTML 文档的底部是一个常见的最佳实践，尤其是在构建网页时。这种做法有助于提高网页的加载性能和用户体验。以下是一些关键原因：
-
改善页面加载速度: 当浏览器加载一个 HTML 页面时，它会按照从上到下的顺序解析和渲染页面内容。如果
<script>标签被放置在页面顶部，浏览器会在继续解析其余页面之前先下载和执行脚本。这可能导致页面渲染被阻塞，从而延迟用户看到内容的时间。将脚本放到页面底部可以确保 HTML 和 CSS 在 JavaScript 执行前就已经加载完毕。 -
降低阻塞渲染: 脚本通常需要额外的网络请求来获取资源，而这些请求可能会导致其他资源（例如图像或样式表）的下载被推迟。通过将
<script>放在文档末尾，可以让浏览器优先加载和渲染可视化内容，如文本和图像，进而改善用户体验。 -
增强可维护性: 将所有脚本集中在文档底部可以使代码更加整洁，并且更容易管理。开发人员能够更直观地了解哪些脚本依赖于 DOM 的完全加载，并能更轻松地进行调试。
-
减少对 DOM 操作的影响: 如果脚本需要操作 DOM 元素，将其放置在文档末尾确保了 DOM 已经完全构建完成。这意味着不需要额外的事件监听或复杂的逻辑来检查 DOM 是否准备就绪。