javascript带回调函数的异步脚本载入方法实例分析

这篇文章主要介绍了javascript带回调函数的异步脚本载入方法,以实例形式较为详细的分析了javascript回调函数实现异步载入的定义与使用技巧,需要的朋友可以参考下

本文实例讲述了javascript带回调函数的异步脚本载入方法。分享给大家供大家参考。具体实现方法如下：

1. var Loader = function () { } 
2. Loader.prototype = { 
3. require: function (scripts, callback) { 
4. this.loadCount = 0; 
5. this.totalRequired = scripts.length; 
6. this.callback = callback; 
7. for (var i = 0; i < scripts.length; i++) { 
8. this.writeScript(scripts[i]); 
9. } 
10. }, 
11. loaded: function (evt) { 
12. this.loadCount++; 
13. if (this.loadCount == this.totalRequired && typeof this.callback == 'function') this.callback.call(); 
14. }, 
15. writeScript: function (src) { 
16. var self = this; 
17. var s = document.createElement('script'); 
18. s.type = "text/javascript"; 
19. s.async = true; 
20. s.src = src; 
21. s.addEventListener('load', function (e) { self.loaded(e); }, false); 
22. var head = document.getElementsByTagName('head')[0]; 
23. head.appendChild(s); 
24. } 
25. } 

用法演示

1. var l = new Loader(); 
2. l.require([ 
3. "example-script-1.js", 
4. "example-script-2.js"], 
5. function() { 
6. // Callback 
7. console.log('All Scripts Loaded'); 
8. }); 

希望本文所述对大家的javascript程序设计有所帮助。