如何测试某个 javascript 库是否从 CDN 成功加载？答案

【问题标题】：How does one test if some javascript library was loaded succesfully from CDN?如何测试某个 javascript 库是否从 CDN 成功加载？
【发布时间】：2021-01-27 09:32:52
【问题描述】：

从 CDN 下载 javascript 文件时，我想提供本地回退。然而，我并不总是很清楚如何测试某个加载是否成功。

对于一些流行的东西，这在其他 StackOverflow 问题中有很好的记录，例如对于 Bootstrap 1，分别测试 if (window.jQuery)、if (window.Popper)、if ($.fn.modal) 的三个部分。但是，对于其他库，这不太明显：

对于 jQuery Validate，我发现相互矛盾的信息：this topic 建议可以做if (window.validator)，this one 建议需要if(typeof $().validate == 'undefined')。这些有什么区别，为什么我需要一个而不是另一个？
对于不太流行的库，例如balanceText，如何判断库是否加载成功？

一般的答案/方法将是完美的，但如果这不可行，我将不胜感激这两个库的答案。

【问题讨论】：

只测试库应该提供的功能。方法有很多
如何测试像balanceText 这样的功能？我想不出任何对象的属性会发生变化，纯粹是视觉上的？
该库提供了一个全局 balanceText 函数（根据文档），您可以测试它的存在。
我明白了。所以简单的if(typeof balanceText == 'undefined') 就足够了吗？有道理，谢谢！
或只是if (window.balanceText)

标签： javascript cdn fallback

【解决方案1】：

如果您自己使用加载脚本，您可以使用script 元素上的onerror 事件来查看脚本是否已加载，而不是检查副作用。示例：

<script>
function cdnLoaded() {
  console.log('loaded');
}

function cdnError() {
  console.log('not loaded');
  // do error handling here
}
</script>

<script onload="cdnLoaded()" onerror="cdnError()" async src="https://unpkg.com/react@17.0.1/umd/react.production.min.js"></script>
<script onload="cdnLoaded()" onerror="cdnError()" async src="https://unpkg.com/nothing-here.js"></script>

【讨论】：