Question

鉴于以下代码，有没有办法确定（从异步回调中）特定脚本是否已完成加载。

<script async id="js" src="//example.com/my-script.js"></script>
<script>
  setTimeout(function() {
    var js = document.getElementById('js');
    js.onload = function() {
      console.log('loaded!');
    }
    js.onerror = function() {
      console.log('error!');
    }
  }, 0);
</script>

在上面的代码中，onload / onerror回调在缓存脚本时不会触发，但是在没有缓存脚本时会触发。

在这样的情况下，有人能想出一种方法来确定特定脚本是否已完成加载（或加载时发生错误）？基本上我正在寻找一种简单的方法来添加加载和/或错误回调，即使在已经发生加载（或错误）的情况下也是如此。

注意：我知道有很多方法可以在JavaScript中完全执行此操作。出于此问题的目的，假设我无法更改脚本标记，它在源中出现的位置或其内容。我想知道，如果现有的<script async>标记指向第三方资源，这是否可行。

谢谢！

Answer 1

也许您可以尝试使用递归函数和sessionStorage或localStorage：

在您加载的脚本中

，在最后声明： localStorage.myScriptIsLoaded=true

然后使用递归函数：

function recursive(){
   if(!localStorage.myScriptIsLoaded){
      setTimeout(recursive(),10);
   }
   else{
   //do what you want to do
   }
} 
recursive();

检测异步脚本的onload / onerror

1 个答案: