当异步资源加载完成时触发的Javascript事件

What Javascript event fires when async resources are finished loading?

本文关键字：Javascript 事件 完成时 异步 资源 加载      更新时间：2023-09-26

如果我像这样异步加载一个脚本

<script type="text/javascript">
    (function () {
        var js = document.createElement('script');
        js.type = 'text/javascript';
        js.async = true;
        js.src = '<%=BundleTable.ResolveUrl("~/js") %>';
        var s = document.getElementsByTagName('script')[0];
        s.parentNode.insertBefore(js, s);
    })();
</script>

什么事件触发一旦异步的东西是完成加载和dom完成加载?

每个事件都有自己的通知机制，所以没有通用的答案。例如，您可以在这里和这里了解如何检测动态加载的脚本何时完成加载。现在，你可以通过使用像YUI或jQuery这样的好框架来节省大量的时间，因为它们大多数都内置了对这些类型事件的跨浏览器支持。

对于完成加载的DOM，没有单一的跨浏览器机制可以让您在完成加载时获得尽可能早的时间。如果你看一下$(document).ready()的jQuery实现，你会发现使用了几种技术(监听"DOMContentLoaded"事件、setTimeout()最早触发的时间、监听window load()、document onreadystatechange事件等)来跨浏览器支持这个功能。

window.onload事件将保证安全的DOM访问，但它也等待所有图像完成加载，这比必要的要晚得多。

相关文章：