脚本上的“加载”事件具有异步和/或延迟

Question

嵌入脚本时：

<script src="..." async defer></script>

有没有办法知道他们什么时候装完？

通常在调用window.load事件时，人们会希望所有脚本都准备就绪。但是，当您使用async或defer加载它们时，我不知道它是否仍然存在。我在线阅读了一些文档，但在这个问题上找不到任何结论。

Answer 1

<强>答案：
加载脚本后，您可以利用onload事件属性来执行某种回调。

示例：
在下面的示例html脚本元素中，当脚本（来自google api的jquery库）异步加载完成后，会弹出一条警告，说明＆＃39;资源已加载＆＃ 39。

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js" async defer onload="alert('resource loaded');">

注意：src脚本加载速度非常快，因为它由google托管，所以弹出窗口很可能会在页面/ DOM加载后立即出现。

编辑：最初从评论中添加了重要信息。

window.onload等待所有内容在开始之前加载，而document.onload在文档对象模型（DOM）准备好时触发。

因此，如果您有异步脚本document.onload将首先执行，而window.onload将等待这些异步脚本完成加载。

总结：

• window.onload 将考虑异步脚本。
• document.onload 不会考虑异步脚本。