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:// ... 
随机推荐
- SQLRecoverableException: I/O Exception: Connection reset
			https://stackoverflow.com/questions/6110395/sqlrecoverableexception-i-o-exception-connection-reset T ... 
- js 在array的遍历操作中修改arry中元素数量 出现的一些奇特的操作
			在js中array是属于复杂类型,在arr1=arr2得赋值操作中,arr1得到的值并不是arr2的value,而是一个指向引用.那么修改arr1的同时arr2读取的值也会同步变化,那么问题来了,上代 ... 
- 【leetcode】640. Solve the Equation
			题目如下: 解题思路:本题的思路就是解析字符串,然后是小学时候学的解方程的思想,以"2x+3x-6x+1=x+2",先把左右两边的x项和非x项进行合并,得到"-x+1=x ... 
- cocos2D-X 显示中文
			{ 将所在的cpp文件改为utf-8 无签名格式再编译 //但,治标不治本 } 
- django中初学常犯错误之梳理
			一,关于setting设置,1,两个INSRALLEN_APPS,需要将新建的app添加进去 2,需要再setting将html的路径拼接起来 二,urls.py 设置,from app名 impor ... 
- VS2014:"64位调试操作花费的时间比预期要长",无法运行调试解决办法
			解决步骤: 右键管理员运行命令提示符,输入IISRESERT,重启IIS即可 
- VMware 虚拟机NAT模式如何设置网络连接,从头到尾全过程~!!
			一.首先查看自己的虚拟机服务有没有开启,选择电脑里面的服务查看: 1.计算机点击右键选择管理 2.进入管理选择VM开头的服务如果没有开启的话就右键开启 二.虚拟机服务开启后就查看本地网络虚拟机的网 ... 
- 二.通过jenkins对系统的监控(1)
			说明:通过jenkins定时请求系统,判断系统是否挂了. 注:windows环境 1.新建一个自由风格的项目. 2.构建触发器选择定时构建. 3.执行windows批处理命令 4.构建后操作,发邮件 ... 
- (5)C++ 循环和判断
			循环 一.for循环 ; i < ; i++) { cout << "abc"<< endl; } 或 ; i; i--) { cout <&l ... 
- (转)spring ioc原理(看完后大家可以自己写一个spring)
			原文地址:https://blog.csdn.net/it_man/article/details/4402245 最近,买了本Spring入门书:spring In Action .大致浏览了下感觉 ... 
