首页 > 解决方案 > 如何判断多个js已经动态加载

问题描述

这是我的js:

const map = new Map();
jsonData.list.forEach(function (item) {
if (!map.get(item.type)) {
  usedLaterScript = document.createElement('script');
  usedLaterScript.type = 'text/javascript';
  usedLaterScript.src = 'js/component/' + item.type + '.js';
  document.body.appendChild(usedLaterScript);
  map.set(item.type, item.type);
 }
});

jsonData:[{"type":"input"},{"type":"radio"},{"type":"select"}]

我想知道所有js(如input.js,radio.js,select.js)何时加载,然后我可以做下一步

标签: javascriptdom

解决方案


加载动态添加的 JS 文件可能需要一些时间。因此您可以将回调绑定到脚本标记,如下所示,我在这里动态加载 JQuery。

<script>
let usedLaterScript = document.createElement('script');
usedLaterScript.src = 'https://code.jquery.com/jquery-3.3.1.min.js';
document.body.appendChild(usedLaterScript);
usedLaterScript.onload = function() {
  if(allScriptsLoaded) {
    allScriptsLoaded();
  }
}; 

</script>
<script>
  allScriptsLoaded = function() {
  
    console.log("Jquery loaded",$);
  }
</script>


推荐阅读