加载 JavaScript 取决于以前异步加载的 JavaScript

Load JavaScript depending on previously asynchronously loaded JavaScript

本文关键字:加载 JavaScript 异步 取决于      更新时间:2023-09-26
<script src="script1.js" async></script>
<script src="script2.js"></script>

script2.js取决于script1.js。由于执行script1.jsscript2.js未完全加载,因此它不起作用。如何解决这个问题?

编辑:我无法删除async属性,我只能修改script2.js的内容。

如果你的第一个脚本必须是异步的,最好把第二个脚本作为异步。

一个天真的解决方案是定期查找第一个脚本可能正在导出的全局变量。

假设 script1 script1export附加到窗口,您可以执行以下操作:

// Regularly check test, and once it is true, call callback.
function waitFor(test, callback, checksPerSec){
   if(test()){
     callback();
   } else {
     checksPerSec = checksPerSec || 10;
     setTimeout(function(){
       waitFor(test, callback, checksPerSec);
     }, 1000 / checksPerSec);
   }
}
waitFor(function(){
  return "script1export" in window;
}, function(){
   // script 2 content
});

这并不理想,但它会起作用。

// script 1
if (!window.myObj1){
    window.myObj1 = script1Obj1;
}
// script 2
if (!window.myObj2){
    window.myObj2 = script2Obj2;
}

// script 1 & script 2
if (window.myObj1 && window.myObj2){
    // run...   
}