如何测试某个 javascript 库是否从 CDN 成功加载?
How does one test if some javascript library was loaded succesfully from CDN?
从 CDN 下载 javascript 文件时,我想提供本地回退。然而,如何测试某个加载是否成功对我来说并不总是很明显。
对于一些流行的东西,这在其他 Whosebug 问题中有详细记录,例如对于 Bootstrap ,只需分别测试其三个部分的 if (window.jQuery)
、if (window.Popper)
、if ($.fn.modal)
。但是,对于其他库,这不太明显:
- 对于 jQuery 验证,我发现了相互矛盾的信息:this topic suggests one can do
if (window.validator)
, this one 建议需要 if(typeof $().validate == 'undefined')
。它们之间有什么区别,为什么我需要一个而不是另一个?
- 对于不太受欢迎的库,例如balanceText,如何查看库是否加载成功?
一个通用的 answer/approach 将是完美的,但如果那不可行,我将不胜感激关于这两个库的答案。
如果您自己使用加载脚本,您可以使用 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>
从 CDN 下载 javascript 文件时,我想提供本地回退。然而,如何测试某个加载是否成功对我来说并不总是很明显。
对于一些流行的东西,这在其他 Whosebug 问题中有详细记录,例如对于 Bootstrap ,只需分别测试其三个部分的 if (window.jQuery)
、if (window.Popper)
、if ($.fn.modal)
。但是,对于其他库,这不太明显:
- 对于 jQuery 验证,我发现了相互矛盾的信息:this topic suggests one can do
if (window.validator)
, this one 建议需要if(typeof $().validate == 'undefined')
。它们之间有什么区别,为什么我需要一个而不是另一个? - 对于不太受欢迎的库,例如balanceText,如何查看库是否加载成功?
一个通用的 answer/approach 将是完美的,但如果那不可行,我将不胜感激关于这两个库的答案。
如果您自己使用加载脚本,您可以使用 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>