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, 可控版本, 有回调的更多相关文章

  1. 动态加载JS,并执行回调函数

    有些时候我们需要动态的加载一些JS,并在JS加载完成后执行一些回调函数. var loadscript = { $$: function (id) { return document.getEleme ...

  2. JavaScript 元素的插入顺序以及动态加载js

    *****************记录下今天的心得***************** 1.元素的插入顺序 需求:异步从后台读取两个数据a和b,并动态加载到父容器x中,要求a必须在b的左边 实际情况:一 ...

  3. 动态加载JS函数

    一般性的,当我们需要加载js文件的时候都会使用script标签来实现,类似于如下代码: 代码如下: <script type="text/javascript" src=&q ...

  4. Ext JS学习第十天 Ext基础之动态加载JS文件(补充)

    此文用来记录学习笔记: •Ext4.x版本提供的一大亮点就是Ext.Loader这个类的动态加载机制!只要遵循路径规范,即可动态加载js文件,方便把自己扩展组件动态加载进来,并且减轻浏览器的压力. • ...

  5. 动态加载js,css(项目中需要的)

    最近做的一个项目需要加入百度统计,大家都知道百度统计在页面引用就是一坨js,实现方法很简单引用到页面就ok了. 那么问题来了,虽然我不知道百度统计的原理是啥,我的测试服引用了百度统计,百度统计账号里面 ...

  6. javascript动态加载js文件主流浏览器兼容版

    一.代码示例: <html> <head> <meta http-equiv="Content-Type" content="text/ht ...

  7. 关于动态加载js

    已知一个需要动态加载的js的文件路径数组,动态加载数组里面所有的js文件. 加载分两种情况: 1. 并行加载,不管js的执行顺序. 2. 串行加载,即一个一个加载,上一个加载完再加载下一个,直到最后. ...

  8. 页面加载异常 清除浏览器静态文件 js css 缓存 js动态加载js css文件,可以配置文件后辍,防止浏览器缓存

    js清除浏览器缓存的几种方法 - 兔老霸夏 - 博客园 https://www.cnblogs.com/Mr-Rocker/p/6031096.html js清除浏览器缓存的几种方法   一.CSS和 ...

  9. js动态加载js文件(js异步加载之性能优化篇)

    1.[基本优化] 将所有需要的<script>标签都放在</body>之前,确保脚本执行之前完成页面渲染而不会造成页面堵塞问题,这个大家都懂. 2.[合并JS代码,尽可能少的使 ...

随机推荐

  1. 使用 data.table 包操作数据

    在第一节中,我们回顾了许多用于操作数据框的内置函数.然后,了解了 sqldf 扩展包,它使得简单的数据查询和统计变得更简便.然而,两种方法都有各自的局限性.使用内置函数可能既繁琐又缓慢,而相对于各式各 ...

  2. 阿里官方Java代码规范标准

    阿里官方Java代码规范标准<阿里巴巴Java开发手册 终极版 v1.3.0>下载 https://www.cnblogs.com/han-1034683568/p/7680354.htm ...

  3. vuejs2点滴

    在Vue定义一个不被添加getter setter 的属性: https://github.com/vuejs/vue/issues/1988 博客: 0.vux的x-input源码分析. http: ...

  4. 发票查验---异步处理多条记录---demo代码

    /// 窗体加载事件        /// </summary>        /// <param name="obj"></param>   ...

  5. C# winform对话框用法大全

      对话框中我们常用了以下几种:1.文件对话框(FileDialog) 它又常用到两个: 打开文件对话框(OpenFileDialog) 保存文件对话(SaveFileDialog)2.字体对话框(F ...

  6. English trip -- Phonics 3 元音字母e

    xu言: 额...今天给我上自然拼读的maple老师 - . -和上次给我上第二集自然拼读的是同一个老师.突然考了考我上次学的内容~感觉大脑一片空白.看来review不能光说而不下苦功夫啊... 元音 ...

  7. 【异常】Application failed to start due to an exception org.springframework.beans.factory.BeanCurrentlyInCreationException

    一. 异常信息:   2018-05-17 18:03:22.224 -DEBUG [  restartedMain] o.s.b.d.LoggingFailureAnalysisReporter   ...

  8. 记录一个错误,在bundle install时候出现 shoulda-mathcers bundle install fails with git error

    复制粘体错误到google.找到解决方案: https://github.com/thoughtbot/shoulda-matchers/issues/1057 GIT remote: https:/ ...

  9. Android之ToolBar的使用

    Toolbar是在 Android 5.0 开始推出的一个 Material Design 风格的导航控件 ,Google 非常推荐大家使用 Toolbar 来作为Android客户端的导航栏,以此来 ...

  10. Confluence 6 自动添加用户到用户组

    默认组成员(Default Group Memberships) 选项在 Confluence 3.5 及后续版本和 JIRA 4.3.3 及后续版本中可用.这字段将会在你选择 'Read Only, ...