Javascript 在onload事件中调用脚本或将代码放在html末尾之间的区别

我正在阅读GoogleMapsAPI文档，偶然发现了一段解释异步加载api的内容。可以找到api文档

例如，它显示了一个如下所示的脚本：

function loadScript() {
  var script = document.createElement("script");
  script.type = "text/javascript";
  script.src = "http://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&sensor=TRUE_OR_FALSE&callback=initialize";
  document.body.appendChild(script);
}

window.onload = loadScript;

这段代码与简单地将脚本调用一直添加到html标记的末尾有什么区别？像这样：

        <!-- rest of the markup -->

        <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&sensor=TRUE_OR_FALSE&callback=initialize"></script>
    </body>
</html>

---

您通常希望JS脚本在加载DOM后运行，而在读取/解析html时不一定会发生此事件。也就是说，在读取HTML和构建JS需要遍历的DOM之间存在一段时间。

您通常希望JS脚本在加载DOM后运行，并且在读取/解析HTML时不一定会发生此事件。也就是说，在读取HTML和构建JS需要遍历的DOM之间存在一段时间