JavaScript：对库文件使用 defer 属性答案

【问题标题】：JavaScript: Using the defer attribute with library filesJavaScript：对库文件使用 defer 属性
【发布时间】：2021-10-22 10:42:12
【问题描述】：

我知道关于defer 和async 属性的讨论很多，但我想澄清一下现代浏览器中的正确用法。

如果我想包含第二个脚本所依赖的库文件，我认为async 不好。要以正确的顺序加载它们，我需要类似：

<script src="library.js" defer></script>
<script src="main.js" defer></script>

根据我的阅读，延迟脚本会在DOMContentLoaded 事件触发之前自动运行。这是否意味着以下内容现在是多余的？

//  main.js
    document.addEventListner('DOMContentLoaded',init);
    function init() {

    }

使用所有现代浏览器都可用的defer 属性，我可以省去等待启动脚本的时间吗？

【问题讨论】：

基于docs 是的-您认为这不是您需要的原因吗？尽管如果您使用的是 Chrome，您可能需要阅读该文档末尾的浏览器兼容性表中的注释，并且该文档以 XHTML 的形式加载
@Bravo 不，我没有任何问题。我想澄清教学目的。我一直使用较旧的技术来延迟我的脚本，但我想确保我正确理解较新的 defer 属性。

【解决方案1】：

是的，在延迟脚本中等待DOMContentLoaded 是多余的*。即使您关心与不支持该属性的浏览器的兼容性，也没有理由这样做，因为此时您还不如删除defer。

^{* 与许多事情一样，存在人为的异常，例如当您依赖于稍后的延迟脚本时}

【讨论】：