按顺序动态加载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代码,尽可能少的使 ...
随机推荐
- Java中的正则表达式Pattern与Matcher
一般来说比起功能有限的String类,我们更愿意构造功能强大的正则表达式.我们可以通过Pattern 与 Matcher 来构建功能强大的正则表达式 import java.io.File; impo ...
- python 时间戳转元组
#!/usr/bin/python # -*- coding: UTF- -*- import time localtime = time.localtime(time.time()) print(& ...
- Goroutines和Channels(五)
Channels也可以用于将多个goroutine连接在一起,一个Channel的输出作为下一个Channel的输入.这种串联的Channels就是所谓的管道(pipeline).下面的程序用两个ch ...
- Json多层嵌套,要怎么提取?
一直用Jmeter的Json Extactor,对于多层的Json嵌套,很好用,自己写代码的时候,总是遇到各种Exception 看了网上的资料,整理一下 1. 最简单的JSON提取,只有一层的时候 ...
- Java 面向对象之static,final,匿名对象,内部类,包,修饰符
01final关键字概念 A: 概述 继承的出现提高了代码的复用性,并方便开发.但随之也有问题,有些类在描述完之后,不想被继承, 或者有些类中的部分方法功能是固定的,不想让子类重写.可是当子类继承了这 ...
- TDD、BDD、DDD
TDDTest-Driven DevelopmentTest-Driven Development (TDD) is a software development technique where au ...
- 代码中特殊的注释技术 -- TODO、FIXME和XXX的用处
借鉴地址:https://www.cnblogs.com/pengyingh/articles/2445826.html 在阅读一些代码时,经常会遇到诸如:TODO.FIXME和XXX的单词,它们是有 ...
- Python定位SVG元素
svgelementXpath = "//div[12]/*[name()='svg']/*[name()='g']/*[name()='g'][2]/*[name()='g'][1]/*[ ...
- mvn编译
mvn clean install -pl com:boss -am -DskipTests
- tomcat和java环境
mac tomcat http://blog.csdn.net/huyisu/article/details/38372663 mac jdk 1.8 http://wlb.wlb.blog.163. ...