var ScriptLoader = {
worker: ,
isWait: false,
readyQueue: [],
callback: [],
timer: null, wait: function () {
if (!this._isComplateTask()) {
this.isWait = true;
this.readyQueue.unshift('wait');
}
//console.log('wait is true');
return this;
}, _isComplateTask: function () {
return this.worker === ;
}, loadJs: function (url, async, callback) {
console.log('load js ' + url);
if (this.isWait) {
// 将js加载到队列
this.readyQueue.unshift(url);
this.callback.unshift(callback); if (!this.timer) {
// 定时处理队列
var that = this;
this.timer = setInterval(function () {
if (that.readyQueue.length === ) {
// 队列消费完, 清除定时器
clearInterval(that.timer);
that.timer = null;
} else if (that._isComplateTask()) {
that._loadReady();
}
}, );
}
} else {
this._realLoad(url, async, callback);
}
return this;
}, /**
* 消费队列
*/
_loadReady: function () {
var url;
while (this.readyQueue.length > ) {
url = this.readyQueue.pop();
if (url === 'wait') {
if (!this._isComplateTask()) {
this.isWait = true;
break;
}
} else {
this._realLoad(url, true, this.callback.pop());
}
}
}, _realLoad: function (url, async, callback) {
this.worker++;
var that = this;
console.log('start load js ' + url);
this._loadJsFile(url, function () {
that.worker--;
if (that.worker === ) {
//console.log('wait is false');
that.isWait = false;
}
if(callback){
callback();
}
}, async);
}, _loadJsFile: function (file, callback, async) {
var head, d = document;
((head = d.getElementsByTagName('head')[]) || (head = d.body.parentNode.appendChild(d.createElement("head")))); var script = d.createElement("script");
script.type = "text/javascript";
script.src = file;
script.charset = 'UTF-8';
if (async) {
script.async = true;
} if (script.readyState) {//IE
script.onreadystatechange = function () {
if (script.readyState === "loaded" || script.readyState === "complete") {
script.onreadystatechange = null;
callback();
}
};
} else {//其他浏览器
script.onload = function () {
callback();
};
} head.appendChild(script);
}
};

动态导入Js文件的更多相关文章

  1. 自己编写jQuery动态引入js文件插件 (jquery.import.dynamic.script)

    这个插件主要是结合jquery或者xhr异步请求来使用的,它可以把已经引入过的js文件记录在浏览器内存中,当下次再引入相同的文件就忽略该文件的引入. 此插件不支持浏览器刷新保存数据,那需要利用cook ...

  2. Extjs学习----------动态载入js文件(减轻浏览器的压力)

    动态载入js文件能够减轻浏览器的压力,本例使用了Ext.window.Window组件,该组件的学习地址:http://blog.csdn.net/z1137730824/article/detail ...

  3. 为了提高性能,怎样动态载入JS文件

    超级表格是一款多人协作的在线表格.程序相当复杂,用到十几个JS文件. 可是有些文件是在打开某些类型的表格时才须要载入. 比如,仅仅有当打开甘特图表格时,才须要载入gantetu.js文件. 那么问题来 ...

  4. asp.net后台代码动态添加JS文件和css文件的引用

    首先添加命名空间 using System.Web.UI.HtmlControls; 代码动态添加css文件的引用 HtmlGenericControl myCss = new HtmlGeneric ...

  5. vue中如何在本地导入js文件

    import {setStore,setUser,getStore,removeStore} from "../../../public/localstory" 在导入js文件时, ...

  6. Boostrap本地导入js文件

    我一般都是用CDN直接导入的,但是有时候需要自己添加一些功能进入,会用到本地导入.关于导入路径问题,做个笔记. 使用HBuilder,首先右键导入相应的js/cs文件 然后是常规——>文件系统 ...

  7. 动态添加js文件.

    方法一: $.getScript(url,callback); 这个方法是对$.ajax({ })的封装.默认是异步的而且是带有缓存的. 缓存对于用户来说,是个好东西,但是对于开发者来说可就是日了狗的 ...

  8. 动态添加JS文件到页面

    /*** ** 功能: 加载外部JS文件,加载完成后执行回调函数callback ***/ var utools = { config: { id: "", url: " ...

  9. jquery----语法扩展(导入js文件)

    简单使用 第一步,新建js文件 第二步,在js文件中添加 $.extend({ "GDP": function () { console.log("哈哈哈哈") ...

随机推荐

  1. rtf乱码解决办法

    首先,阐述下rtf,富文本格式文档,目前常用来做模板: 我遇到的问题是rtf中替换后的文本显示是正常的,rtf直接转pdf就不正常了,通过notpad++ 打开后发现rtf本身内容编码是我没有见过的( ...

  2. pycharm上传代码到远程服务器

    本来不打算写了,可是,还是记不住 源自https://blog.csdn.net/zhangyu4863/article/details/80188207 我的是pycharm2018.1.4专业版: ...

  3. EOJ Monthly 2019.2

    题解 A 回收卫星 #pragma GCC optimize(2) #pragma GCC optimize(3) #pragma GCC optimize(4) #include<bits/s ...

  4. python 数据分类赋值

    问题描述:在数据预处理时,往往需要对描述性数据进行分类赋值或对数据进行分级赋值. 首先,会想到用for循环,依次判断赋值: for n in range(len(data1)): print(n) i ...

  5. sql server 将两列数据合并到一列 拼接

    create table a( s nvarchar null, ss nvarchar null, f decimal(18,1) null, ff decimal(18,1) null,)INSE ...

  6. sqlserver 查询表锁死,解除表锁死

    查询锁死的表名以及ID select request_session_id id, OBJECT_NAME(resource_associated_entity_id) tableName FROM ...

  7. JS数组遍历

    1. forEach() 循环数组,不会改变元素,不会返回新数组 arr.foreach((value,index)=>{}) 2. map() 遍历数组,对每个元素进行处理,之后返回元素:会返 ...

  8. springcloud-spring cloud config统一配置中心

    统一配置中心 为什么需要统一配置中心? 统一配置中心顾名思义,就是将配置统一管理,配置统一管理的好处是在日后大规模集群部署服务应用时相同的服务配置一致,日后再修改配置只需要统一修改全部同步,不需要一个 ...

  9. HTML5离线存储的工作原理和使用

    在用户没有与因特网连接时,可以正常访问站点或应用,在用户与因特网连接时,更新用户机器上的缓存文件. 原理:HTML5的离线存储是基于一个新建的.appcache文件的缓存机制(不是存储技术),通过这个 ...

  10. 在Ubuntu 18.04 安装 MySQL 8.0

    在Ubuntu 18.04 安装 MySQL 8.0 ① 登入 mysql 官网,在官网中下载 deb 包,点击该链接,即可下载. https://dev.mysql.com/downloads/re ...