异步资源加载完成后会触发什么 Javascript 事件？

【问题标题】：What Javascript event fires when async resources are finished loading?异步资源加载完成后会触发什么 Javascript 事件？
【发布时间】：2011-09-29 12:27: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 加载完成后会触发什么事件？

【问题讨论】：

jQuery(function($){$.getScript('...url...', function(){...callback...});}); 简单多了...
我在该请求中加载的部分内容是 jquery
你会想在那里做js.onload = function() {}。请参阅此处了解更多信息：stackoverflow.com/a/28002292/1329367

标签： javascript

【解决方案1】：

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

对于 DOM 完成加载，没有单一的跨浏览器机制可以让您尽早完成加载。如果您查看 $(document).ready() 的 jQuery 实现，您会看到采用了多种技术（侦听“DOMContentLoaded”事件、setTimeout() 触发的最早时间、侦听窗口 load()、文档onreadystatechange 事件等）以支持跨浏览器的此功能。

window.onload 事件将保证安全的 DOM 访问，但它也会等待所有图像完成加载，这比必要的要晚得多。这些其他技术用于获得更早的安全访问。

【讨论】：