嵌入脚本时:
<script src="..." async defer></script>
有没有办法知道他们什么时候装完?
通常在调用window.load
事件时,人们会期望所有脚本都准备就绪。但我不知道当你用async
或defer
加载它们时是否仍然存在。我在线阅读了一些文档,但在这个问题上找不到任何结论。
回答:
您可以利用onload
事件属性,以便在加载脚本后执行某种回调。
例:
在下面的示例html脚本元素中,当脚本(来自google api的jquery库)完成异步加载时,会弹出一个警告,说“资源已加载”。
<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
不会考虑异步脚本。