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

How to add callback after dynamically loading javascript file

本文关键字：文件 添加 回调 javascript 加载 动态      更新时间：2023-09-26

我有以下功能：

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];

文件尚未加载，因此会生成一个错误。

您可以在script元素上添加onLoad，但要注意，在一些旧版本的IE上有点bug。

以您的代码为参考：

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
});

根据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
    });
相关文章：