动态加载script 加载完成回调事件

序言

网页中有很多的第三方插件都是通过直接引入script库的方式进行加载，由于加载脚本需要时间，如果script还没有加载完成，便使用库中的对象就会有错误。

解决方案

获取script DOM 对象
绑定onload事件异步回调

总体的思路是这样子

  asyncComplete() {return new Promise((resolve, reject) => {//获取HTMLCollection //我这边已经确定对象第一个就是要加载的js 便取第一个对象const [twscript,] = document.getElementsByTagName('script');//ieif (twscript.readyState) {twscript.onreadystatechange = () => {if (twscript.readyState === "complete" || twscript.readyState === 'loaded') {resolve()}}} else {twscript.onload = resolve()}})}

使用方法

//使用方法async mountd() {await this.asyncComplete();//TODO}

动态加载script 加载完成回调事件相关推荐

php动态加载js,动态加载script文件的两种方法_javascript技巧
动态加载script到页面大约有俩方法第一种就是利用ajax方式,把script文件代码从后台加载到前台,然后对加载到的内容通过eval()执行代码.第二种是,动态创建一个script标签,设置其s ...
html加载js文件失败,firefox/chrome动态设置script加载js文件失败
firefox,chrome等w3c浏览器下面,设置script标签的src来动态加载js文件时,有2中情况 1)如果script标签已经加载过js文件,那么重新设置为其他js文件的路径时,无法加载这 ...
html a标签 onload,动态加载script和css标签的onload问题
在firefox下,动态加载script标签和css标签,是可以简单地监听onload事件的,但在ie下,监听onload事件无效.为了解决这个问题,可以改用监听onreadystatechange, ...
关闭浏览器网页触发事件_浅析浏览器渲染和 script 加载
前言前端代码离不开浏览器环境,理解 js.css 代码如何在浏览器中工作是非常重要的. 如何优化渲染过程中的回流,重绘?script 脚本在页面中是怎么个加载顺序?了解这些对前端性能优化起着非常大的 ...
Vue(小码哥王洪元)笔记06路由，url的hash，history，router-linke，路由跳转，动态路由，懒加载，路由嵌套，router参数传递，导航守卫
1.什么是路由路由器提供了两种机制:路由和传送路由:数据报从来源到目的地的路径传输:将输入端的数据转移到合适的输出端路由有一个非常重要的概念教路由表路由表本质上就是一个映射表,决定了数据包的 ...
Android Glide图片加载框架（四）回调与监听
文章目录 Android Glide图片加载框架系列文章 Android Glide图片加载框架(一)基本用法 Android Glide图片加载框架(二)源码解析之with() Android Gl ...
一. spring cloud gateway集成 spring cloud stream binder kafka，实现“动态路由“刷新与加载之采坑记录
一.前言 Spring Cloud Stream是用于构建消息驱动的微服务应用程序的框架. 本文主要介绍如何集成 Spring Cloud Stream,以 Kafka发布订阅模式(topic),实现 ...
VUE动态路由组件懒加载解决方案
项目场景: 将项目静态路由替换成动态路由,通过后台数据拿到路由配置信息动态加载问题描述: 小编将路由信息与系统菜单信息存在一起,当登录后拿到菜单信息后同时处理路由数据,过程肯定不是那么一帆风顺的,下 ...
Linux动态库的动态加载与静态加载以及加载依赖了其他动态库的动态库
Linux动态库加载在Linux下,动态库格式一般为libxxx.so或者libxxx.so.3这种格式. 通常我们在网上下载下来源码包,编译之后会是libxxx.so软连接libxxx.so.1链 ...

动态加载script 加载完成回调事件

序言

动态加载script 加载完成回调事件相关推荐

最新文章

热门文章