js中如何避免动态引入重复资源
创建存储数据的数组或者对象;
每次调用方法的时候,往里面添加资源对象,包括路径;
每次调用的时候遍历此路劲是否存在,如存在,就调用此资源对象的promise进行操作。
可避免资源未加载完成就执行的情况。
var arr = [];
function getStyle(src){
let script = document.createElement('script');
script.type = 'text/javascript';
script.async = true;
script.defer = true;
script.src = src;
arr.find(e => e.src === src) || document.head.appendChild(script);
arr.find(e => e.src === src) || arr.push({
src: src,
promise: new Promise((rev,rej) => {
script.onload = () => rev(222)
})
});
return arr.find(e => e.src === src).promise;
}
for(var i = 0;i < 20;i++){
getStyle('https://code.jquery.com/jquery-3.1.1.min.js').then((a)=>console.log(a));
}
js中如何避免动态引入重复资源的更多相关文章
- js教程--从入门到精通 第一篇 js的前世今生以及js中基本数据类型和引入方式
1.Javascript前世今生 1.1.什么是Javascript Javascript运行于Javascript [解释器/引擎]中的解释性脚本语言 Javascript ...
- JS中如何防止表单重复提交问题
在登录页面html中写如下代码 <script type="text/javascript"> var issubmit=false; function dosubmi ...
- js中几种动态创建元素并设置文本内容的比较,及性能测试。
内容 1 appendChild (都兼容) 2.insertAdjacentHTML (都兼容) 3.innerHTML (都兼容) 4.createDocumentFragment (都兼容) 动 ...
- 如何在 JS 中嵌入大量 HTML 代码 --更新2017-10-10 16:37:09
一.一般方式 方式1:\ 要写在标签后面,看例子 var longString = "\ ------------------------\ ------------------------ ...
- https 页面中引入 http 资源的解决方式
相对协议 应用场景 浏览器默认是不允许在 https 里面引用 http 资源的,一般都会弹出提示框. 用户确认后才会继续加载,用户体验非常差. 而且如果在一个 https 页面里动态的引入 http ...
- https http 混合访问_https 页面中引入 http 资源的解决方式
解决android 5.0 webview不能加载http与https混合内容的问题 在使用WebView加载https资源文件时,如果认证证书不被Android认可,那么会出现无法成功加载对应资源问 ...
- vue中动态引入图片为什么要是require, 你不知道的那些事
相信用过vue的小伙伴,肯定被面试官问过这样一个问题:在vue中动态的引入图片为什么要使用require 有些小伙伴,可能会轻蔑一笑:呵,就这,因为动态添加src被当做静态资源处理了,没有进行编译,所 ...
- JS动态引入js,CSS——动态创建script/link/style标签
一.动态创建link方式 我们可以使用link的方式.如下代码所示. 二.动态创建style方式 但是,这样的话,需要加载整个css文件,但是那样有可能浪费一个http请求并占用一个服务器请求数,并等 ...
- js动态引入的四种方式
index.html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http:// ...
随机推荐
- Android面向切面编程(AOP)(转)
转自:https://www.jianshu.com/p/aa1112dbebc7 一.简述 1.AOP的概念 如果你用java做过后台开发,那么你一定知道AOP这个概念.如果不知道也无妨,套用百度百 ...
- html打开子窗口
第一个参数是打开的链接,第二个参数是窗口的名字,第三个参数是窗口的属性 window.open ("page.html", "newwindow", " ...
- css 设置背景图片透明
最终效果: 背景图片css不变,再背景图片的里层元素设置css样式即可 opacity:0.4; filter:alpha(opacity=40); /* 针对 IE8 以及更早的版本 */
- webpack第一节(4)
每次修改了代码都需要重新手动打包,这样很麻烦,不符合webpack的初衷,我们查看webpack帮助看看有没有可以自动运行的方法 输入 webpack -help 可以发现有个 --watch方法 它 ...
- RAM/ROM IP一次性总结
1, 若需要修改memory mode, 需重新编译; 若不需要修改memory mode, 直接修改宏参数即可; 2, 宏参数列表: 3, 注意用LE搭memory的情况; 4, memory ty ...
- 04-树5 Root of AVL Tree(25 分)
An AVL tree is a self-balancing binary search tree. In an AVL tree, the heights of the two child sub ...
- C# 串口总结
一.串口初始化 定义: using System.IO.Ports; SerialPort myPort = new SerialPort() 初始化: //port初始化 public void _ ...
- vue中引入路由,如果你懒得写那么
可以npm i vue-router --save,项目中自动给你写好,vuex也可以
- javaweb登录验证码的实现
第一种 第一步: JSP <li><input name="validCode" id="validCode" type="te ...
- QMUI android 框架 git下载项目运行报错解决 input String“”
1.编译源码,input String“” 解决办法: 打开qmuidemo里面的gradle文件,注释掉顶部的 //def cmd = 'git rev-list HEAD --count'//de ...