Javascript document.createElement('script')... 用一个回调添加两个脚本
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/1866717/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
document.createElement('script')... adding two scripts with one callback
提问by user199085
I need to add prototype and then add scriptaculous and get a callback when they are both done loading. I am currently loading prototype like so:
我需要添加原型，然后添加 scriptaculous 并在它们都完成加载后获得回调。我目前正在像这样加载原型：
var script = document.createElement("script");
script.src = "http://ajax.googleapis.com/ajax/libs/prototype/1.6.1.0/prototype.js";
script.onload = script.onreadystatechange = callback;
document.body.appendChild( script );
I could do this by chaining the callbacks, but that seems like poor practice ( I don't want a silly chain of 20 callback methods when I need to load more scripts). Ideas?
我可以通过链接回调来做到这一点，但这似乎是一种糟糕的做法（当我需要加载更多脚本时，我不想要一个由 20 个回调方法组成的愚蠢链）。想法？
回答by nemisj
I propose you to use some small loader which will chain and do stuff for you. For example like this one:
我建议你使用一些小型装载机，它会为你链接和做一些事情。例如像这样一个：
function loadScripts(array,callback){
var loader = function(src,handler){
var script = document.createElement("script");
script.src = src;
script.onload = script.onreadystatechange = function(){
script.onreadystatechange = script.onload = null;
handler();
}
var head = document.getElementsByTagName("head")[0];
(head || document.body).appendChild( script );
};
(function run(){
if(array.length!=0){
loader(array.shift(), run);
}else{
callback && callback();
}
})();
}
This script should help you to build the script tags and call your callback when all files are loaded. Invoke is pretty easy:
此脚本应该可以帮助您构建脚本标签并在加载所有文件时调用您的回调。调用非常简单：
loadScripts([
"http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js",
"http://ajax.googleapis.com/ajax/libs/prototype/1.6.1.0/prototype.js"
],function(){
alert('All things are loaded');
});
Hope this will help
希望这会有所帮助
回答by gerteb
Because of a bug in Internet Explorer the recursive loader program from nemisj is not working correct in IE. Can be solved by setting a delay on the recursive call like:
由于 Internet Explorer 中的错误，nemisj 的递归加载程序在 IE 中无法正常工作。可以通过在递归调用上设置延迟来解决，例如：
function loadScripts(array,callback){
var loader = function(src,handler){
var script = document.createElement("script");
script.src = src;
script.onload = script.onreadystatechange = function(){
script.onreadystatechange = script.onload = null;
if(/MSIE ([6-9]+\.\d+);/.test(navigator.userAgent))window.setTimeout(function(){handler();},8,this);
else handler();
}
var head = document.getElementsByTagName("head")[0];
(head || document.body).appendChild( script );
};
(function(){
if(array.length!=0){
loader(array.shift(),arguments.callee);
}else{
callback && callback();
}
})();
}
This small hack does it, and often is the solution in IE, when an unexplainable problem occurs, which is too often.
这个小 hack 做到了，通常是 IE 中的解决方案，当出现无法解释的问题时，这种情况太频繁了。
回答by Eric Bréchemier
Since scriptaculous requires prototype, you will have to chain the listeners, with whatever method you use to load these scripts.
由于 scriptaculous 需要原型，因此您必须使用任何用于加载这些脚本的方法链接侦听器。
There are various script loaders available to load scripts in parallel, as fast as possible, e.g. LABjs, but none is going to help much in this scenario.
有各种脚本加载器可用于以尽可能快的速度并行加载脚本，例如LABjs，但在这种情况下没有任何帮助。
If you end up having 10-20 scripts to load, I would recommend combining the scripts beforehand, using a tool such as a Combiner.
如果您最终要加载 10-20 个脚本，我建议您使用诸如Combiner 之类的工具预先组合脚本。
