Javascript：有什么方法可以检测所有异步脚本何时加载？答案

【问题标题】：Javascript: Is there any way to detect when all async scripts have loaded?Javascript：有什么方法可以检测所有异步脚本何时加载？
【发布时间】：2017-04-08 02:34:28
【问题描述】：

如果您在 HTML 页面上使用纯脚本标记，则在下载并解析脚本之前，渲染会被阻止。为了避免这种情况，为了更快的页面显示，您可以添加“异步”属性，它告诉浏览器继续处理页面而不等待该脚本。但是，这本质上意味着引用该脚本中任何内容的其他 javascript 可能会崩溃，因为它需要的对象还不存在。

据我所知，没有可以绑定的 allScriptsLoaded 事件，所以我正在寻找模拟的方法。

我知道以下策略可以推迟运行其他代码，直到异步脚本可用：

对于单个脚本，使用它们的“onload”事件或属性。但是，我所知道的没有内置方法可以判断所有脚本何时已加载（如果有多个脚本）。
在附加到窗口的 onload 事件处理程序中运行所有相关代码。但是，它们也等待所有图像，而不仅仅是所有脚本，因此运行时间晚于理想情况。
使用加载器库加载所有脚本；那些通常提供在所有内容加载后运行的回调。缺点（除了需要一个库来执行此操作，它必须提前加载）是所有代码都必须包装在一个（通常是匿名的）函数中，然后传递给加载器库。这与创建一个在我的神话 allScriptsLoaded 触发时运行的函数相反。

我错过了什么，还是最先进的？

【问题讨论】：

我也想要一个答案！似乎没有办法在加载之前检查 <script async></script> 元素以查看它是否已加载而不添加 onload 处理程序。
这可能包括您正在寻找的答案：stackoverflow.com/questions/950087/…

标签： javascript asynchronous

【解决方案1】：

您可能希望的最好结果是知道是否有任何未完成的异步调用（XMLHttpRequest、setTimeout、setInterval、SetImmediate、process.nextTick、Promise），然后等待没有。但是，这是底层本机代码丢失的实现细节——javascript只有它自己的事件循环，如果我理解正确的话，异步调用会传递给本机代码。最重要的是，您无权访问事件循环。您只能插入，不能读取或控制流程（除非您在 io.js 和 feeling frisky 中）。

模拟的方法是自己跟踪脚本调用，并在所有脚本完成后调用。（即，每次将相关脚本插入事件循环时进行跟踪。）

但是，是的，DOM 不提供 NoAsyncPending 全局或其他东西，而这是您真正需要的。

【讨论】：