+
95
-

async、defer、ContentLoaded有啥区别?

async、defer、ContentLoaded有啥区别?


网友回复

+
15
-

async、defer 和 DOMContentLoaded 都涉及到HTML文档中脚本的加载和执行,但它们有不同的用途和行为。

async 属性:

当您在 <script> 标签中使用 async 属性时,脚本会异步加载,不会阻止页面的解析和渲染。

脚本会在加载完成后立即执行,而不管其在页面中的位置如何。这意味着脚本可能在页面的其他内容加载和解析之前运行。

如果有多个脚本使用 async 属性,并且它们之间有依赖关系,执行顺序可能会不确定。

适合用于不需要按顺序执行的独立脚本。

示例:<script src="script1.js" async></script>