动态加载javascript文件后如何添加回调答案

【问题标题】：How to add callback after dynamically loading javascript file动态加载javascript文件后如何添加回调
【发布时间】：2017-04-16 14:05:45
【问题描述】：

我有以下功能：

function require(url)
{
    var e = document.createElement("script");
    e.src = url;
    e.type="text/javascript";
    document.getElementsByTagName("head")[0].appendChild(e);
}

它允许在运行时动态加载javascript，我需要在加载一些新文件后添加一个回调

例如当我

require('className.js');

就在这次通话之后

var a = new window[className];

文件尚未加载，因此会产生错误。

【问题讨论】：

require(url, callback) { ... e.onload = callback }

标签： javascript

【解决方案1】：

您可以在脚本元素上添加一个 onLoad，但请注意，在某些旧版本的 IE 上有点错误。

以您的代码作为参考：

function require(url, callback) 
{
  var e = document.createElement("script");
  e.src = url;
  e.type="text/javascript";
  e.addEventListener('load', callback);
  document.getElementsByTagName("head")[0].appendChild(e);
}

require("some.js", function() { 
   // Do this and that
});

【讨论】：

你几乎是对的......但是 e.addEventListener('load', callback);更好）
用 addEventListener 编辑

【解决方案2】：

进一步了解 Simone Gianni 的回答，如果您想加载一组 js 文件，并在最后运行一个回调，您想确保所有文件都已加载，您可以递归地执行以下操作：

function loadList(list, i, callback)
        {
            require(list[i], function()
            {
                if(i < list.length-1)
                {
                    loadList(list, i+1, callback);  
                }
                else
                {
                    callback();
                }
            });
        }

致电：

    loadList(jsList, 0, function()
    {
        // code that applies after all URLs in jsList have loaded
    });

【讨论】：