按顺序动态加载js, 可控版本, 有回调
load和onScriptLoad方法是直接从layerui的源码里粘贴出来修改了一下用的, 来源: https://gitee.com/sentsin/layui/blob/master/src/layui.js
var version = 1;
function jsloader(arr, cb) {
var head = document.getElementsByTagName('head')[0];
var _load_index = 0;
function onScriptLoad(node, e, url) {
var readyRegExp = navigator.platform === 'PLaySTATION 3' ? /^complete$/ : /^(complete|loaded)$/
if (e.type === 'load' || (readyRegExp.test((e.currentTarget || e.srcElement).readyState))) {
head.removeChild(node);
onCallback();
}
}
function onCallback() {
_load_index++;
if (_load_index == arr.length) {
cb();
} else {
load(arr[_load_index]);
}
}
var isOpera = typeof opera !== 'undefined' && opera.toString() === '[object Opera]';
function load(url) {
var node = document.createElement('script');
node.async = true;
node.charset = 'utf-8';
node.src = url + '?v=' + version;
head.appendChild(node);
if (node.attachEvent && !(node.attachEvent.toString && node.attachEvent.toString().indexOf('[native code') < 0) && !isOpera) {
node.attachEvent('onreadystatechange', function (e) {
onScriptLoad(node, e, url);
});
} else {
node.addEventListener('load', function (e) {
onScriptLoad(node, e, url);
}, false);
}
}
load(arr[_load_index]);
}
使用方法:
//使用方式
jsloader(["js/1.js", "js/2.js", "js/3.js"], function () {
console.log('all complete');
});
1/2/3.js内容
//1.js
var a = 1;
console.log(1); //2.js
var b = 1;
console.log('a:' + a + ' / ' + 2); //3.js
var c = 1;
console.log('a:' + a + ' / ' + 'b:' + b + ' / ' + 3);
效果:

按顺序动态加载js, 可控版本, 有回调的更多相关文章
- 动态加载JS,并执行回调函数
有些时候我们需要动态的加载一些JS,并在JS加载完成后执行一些回调函数. var loadscript = { $$: function (id) { return document.getEleme ...
- JavaScript 元素的插入顺序以及动态加载js
*****************记录下今天的心得***************** 1.元素的插入顺序 需求:异步从后台读取两个数据a和b,并动态加载到父容器x中,要求a必须在b的左边 实际情况:一 ...
- 动态加载JS函数
一般性的,当我们需要加载js文件的时候都会使用script标签来实现,类似于如下代码: 代码如下: <script type="text/javascript" src=&q ...
- Ext JS学习第十天 Ext基础之动态加载JS文件(补充)
此文用来记录学习笔记: •Ext4.x版本提供的一大亮点就是Ext.Loader这个类的动态加载机制!只要遵循路径规范,即可动态加载js文件,方便把自己扩展组件动态加载进来,并且减轻浏览器的压力. • ...
- 动态加载js,css(项目中需要的)
最近做的一个项目需要加入百度统计,大家都知道百度统计在页面引用就是一坨js,实现方法很简单引用到页面就ok了. 那么问题来了,虽然我不知道百度统计的原理是啥,我的测试服引用了百度统计,百度统计账号里面 ...
- javascript动态加载js文件主流浏览器兼容版
一.代码示例: <html> <head> <meta http-equiv="Content-Type" content="text/ht ...
- 关于动态加载js
已知一个需要动态加载的js的文件路径数组,动态加载数组里面所有的js文件. 加载分两种情况: 1. 并行加载,不管js的执行顺序. 2. 串行加载,即一个一个加载,上一个加载完再加载下一个,直到最后. ...
- 页面加载异常 清除浏览器静态文件 js css 缓存 js动态加载js css文件,可以配置文件后辍,防止浏览器缓存
js清除浏览器缓存的几种方法 - 兔老霸夏 - 博客园 https://www.cnblogs.com/Mr-Rocker/p/6031096.html js清除浏览器缓存的几种方法 一.CSS和 ...
- js动态加载js文件(js异步加载之性能优化篇)
1.[基本优化] 将所有需要的<script>标签都放在</body>之前,确保脚本执行之前完成页面渲染而不会造成页面堵塞问题,这个大家都懂. 2.[合并JS代码,尽可能少的使 ...
随机推荐
- 机器学习 MLIA学习笔记(二)之 KNN算法(一)原理入门实例
KNN=K-Nearest Neighbour 原理:我们取前K个相似的数据(排序过的)中概率最大的种类,作为预测的种类.通常,K不会大于20. 下边是一个简单的实例,具体的含义在注释中: impor ...
- Spring Boot 2.1.1.RELEASE 多数据源配置与使用
有时候,一个系统的功能,需要两个或两个以上的数据库, 在Spring Boot 中要如何配置? How to? #primary primary.spring.datasource.jdbc-url= ...
- JavaScript中对象数组 作业题目以及作业
var BaiduUsers = [], WechatUsers = []; var User = function(id, name, phone, gender, age, salary) { t ...
- python中sys.stdout、sys.stdin
如果需要更好的控制输出,而print不能满足需求,sys.stdout,sys.stdin,sys.stderr就是你需要的. 1. sys.stdout与print: 在python中调用print ...
- cocos2dx 在windows下开启console
cocos2dx 3.10 1.在main函数中写入代码 AllocConsole(); freopen("CONIN$", "r", stdin); freo ...
- WPF全屏
https://blog.onedevjob.com/2010/10/19/fixing-full-screen-wpf-windows/ 让窗口重绘 Visibility = Visibility. ...
- 12月13日 什么是help_method,session的简单理解, find_by等finder method
helper_method Declare a controller method as a helper. For example, helper_method :link_to def link_ ...
- 使用nginx+dnsmasq解决同IP不同端口Session冲突问题
由于一台服务器上需要部署多个项目,而我们的WEB项目因为用到框架都是一样的,导致同时运行,session相互冲突,这个登录后,那个就得重新登录,造成了使用不方便,原因是IP相同认为是同一个域,接收了B ...
- Angular2 -- 生命周期
组件生命周期钩子 指令和组件的实例有一个生命周期:新建.更新和销毁. 每个接口都有唯一的一个钩子方法,它们的名字是由接口名加上 ng前缀构成的.比如,OnInit接口的钩子方法叫做ngOnInit. ...
- seekg()/seekp()与tellg()/tellp()的用法详解
本文转载于:http://blog.csdn.net/mafuli007/article/details/7314917 (在tcp的文件发送部分有应用) 对输入流操作:seekg()与tellg() ...