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


Posted in Javascript onJuly 02, 2015

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

var Loader = function () { }
Loader.prototype = {
  require: function (scripts, callback) {
    this.loadCount   = 0;
    this.totalRequired = scripts.length;
    this.callback    = callback;
    for (var i = 0; i < scripts.length; i++) {
      this.writeScript(scripts[i]);
    }
  },
  loaded: function (evt) {
    this.loadCount++;
    if (this.loadCount == this.totalRequired && typeof this.callback == 'function') this.callback.call();
  },
  writeScript: function (src) {
    var self = this;
    var s = document.createElement('script');
    s.type = "text/javascript";
    s.async = true;
    s.src = src;
    s.addEventListener('load', function (e) { self.loaded(e); }, false);
    var head = document.getElementsByTagName('head')[0];
    head.appendChild(s);
  }
}

用法演示

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

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

Javascript 相关文章推荐
jQuery Ajax 仿AjaxPro.Utility.RegisterTypeForAjax辅助方法
Sep 27 Javascript
在页面上用action传递参数到后台出现乱码的解决方法
Dec 31 Javascript
javascript几个易错点记录
Nov 26 Javascript
javascript转换静态图片,增加粒子动画效果
May 28 Javascript
PHP结合jQuery实现红蓝投票功能特效
Jul 22 Javascript
关于cookie的初识和运用(js和jq)
Apr 07 Javascript
JavaScript数组和对象的复制
Mar 21 Javascript
JS中类的静态方法,静态变量,实例方法,实例变量区别与用法实例分析
Mar 14 Javascript
JavaScript Event Loop相关原理解析
Jun 10 Javascript
Vue生命周期activated之返回上一页不重新请求数据操作
Jul 26 Javascript
Selenium执行JavaScript脚本的方法示例
Dec 31 Javascript
JavaScript函数柯里化
Nov 07 Javascript
javascript 闭包详解
Jul 02 #Javascript
JavaScript实现点击自动选择TextArea文本的方法
Jul 02 #Javascript
浅谈Javascript线程及定时机制
Jul 02 #Javascript
JavaScript获得url查询参数的方法
Jul 02 #Javascript
js跨域请求的5中解决方式
Jul 02 #Javascript
JS实现从连接中获取youtube的key实例
Jul 02 #Javascript
由ReactJS的Hello world说开来
Jul 02 #Javascript
You might like
总集篇&特番节目先行播出!《SAO Alicization War of Underworld》第2季度TV动画4月25日放送!
2020/03/06 日漫
java EJB 加密与解密原理的一个例子
2008/01/11 PHP
cmd下运行php脚本
2008/11/25 PHP
php array_filter除去数组中的空字符元素
2020/06/21 PHP
php获取汉字首字母的函数
2013/11/07 PHP
FastCGI 进程意外退出造成500错误
2015/07/26 PHP
Yii框架的redis命令使用方法简单示例
2019/10/15 PHP
使javascript也能包含文件
2006/10/26 Javascript
一段效率很高的for循环语句使用方法
2007/08/13 Javascript
IE6下拉框图层问题探讨及解决
2014/01/03 Javascript
js动态移动滚动条至底部示例代码
2014/04/24 Javascript
jquery中checkbox全选失效的解决方法
2014/12/26 Javascript
jQuery实现非常实用漂亮的select下拉菜单选择效果
2015/11/06 Javascript
Node.js检测端口(port)是否被占用的简单示例
2016/09/29 Javascript
JS简单实现表格排序功能示例
2016/12/20 Javascript
Node.js websocket使用socket.io库实现实时聊天室
2017/02/20 Javascript
Nodejs多站点切换Htpps协议详解及简单实例
2017/02/23 NodeJs
js实现悬浮窗效果(支持拖动)
2017/03/09 Javascript
vuex的module模块用法示例
2018/11/12 Javascript
弱类型语言javascript中 a,b 的运算实例小结
2019/08/07 Javascript
基于Layui自定义模块的使用方法详解
2019/09/14 Javascript
js实现随机点名
2021/01/19 Javascript
用Python实现协同过滤的教程
2015/04/08 Python
利用Python的Django框架生成PDF文件的教程
2015/07/22 Python
Python的argparse库使用详解
2018/10/09 Python
PowerBI和Python关于数据分析的对比
2019/07/11 Python
如何运行带参数的python脚本
2019/11/15 Python
Python面向对象实现方法总结
2020/08/12 Python
详解HTML5中的拖放事件(Drag 和 drop)
2016/11/14 HTML / CSS
《沙漠中的绿洲》教学反思
2014/04/24 职场文书
cf战队收人口号
2014/06/21 职场文书
县长“四风”对照检查材料思想汇报
2014/10/05 职场文书
群众路线调研报告范文
2014/11/03 职场文书
2015年幼师工作总结
2015/04/28 职场文书
小组口号霸气押韵
2015/12/24 职场文书
CSS元素定位之通过元素的标签或者元素的id、class属性定位详解
2022/09/23 HTML / CSS