博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
如何判断脚本加载完成
阅读量:3521 次
发布时间:2019-05-20

本文共 1253 字,大约阅读时间需要 4 分钟。

在“按需加载”的需求中,我们经常会判断当脚本加载完成时,返回一个回调函数,那如何去判断脚本的加载完成呢?

我们可以对加载的 JS 对象使用 onload 来判断(js.onload),此方法 Firefox2、Firefox3、Safari3.1+、Opera9.6+ 浏览器都能很好的支持,但 IE6、IE7 却不支持。曲线救国 —— IE6、IE7 我们可以使用 js.onreadystatechange 来跟踪每个状态变化的情况(一般为 loading 、loaded、interactive、complete),当返回状态为 loaded 或 complete 时,则表示加载完成,返回回调函数。

对于 readyState 状态需要一个补充说明:

  1. 在 interactive 状态下,用户可以参与互动。
  2. Opera 其实也支持 js.onreadystatechange,但他的状态和 IE 的有很大差别。

具体实现代码如下:

function include_js(file) {    var _doc = document.getElementsByTagName('head')[0];    var js = document.createElement('script');    js.setAttribute('type', 'text/javascript');    js.setAttribute('src', file);    _doc.appendChild(js);    if (!/*@cc_on!@*/0) { //if not IE        //Firefox2、Firefox3、Safari3.1+、Opera9.6+ support js.onload        js.onload = function () {            alert('Firefox2、Firefox3、Safari3.1+、Opera9.6+ support js.onload');        }    } else {        //IE6、IE7 support js.onreadystatechange        js.onreadystatechange = function () {            if (js.readyState == 'loaded' || js.readyState == 'complete') {                alert('IE6、IE7 support js.onreadystatechange');            }        }    }    return false;}//execution functioninclude_js('http://www.planabc.net/wp-includes/js/jquery/jquery.js');

转载地址:http://nymqj.baihongyu.com/

你可能感兴趣的文章
插入排序
查看>>
哈夫曼树java代码实现
查看>>
快速排序
查看>>
vue路由高亮的两种方式
查看>>
vue router 报错: Uncaught (in promise) NavigationDuplicated {_name:""NavigationDuplicated"... 的解决方法
查看>>
vue跳转页面的两种方式
查看>>
存储器题目解析(持续更新中....)
查看>>
存储器知识要点
查看>>
Cache模拟器的实现
查看>>
实验2:MIPS指令系统和MIPS体系结构
查看>>
设计模式七大原则
查看>>
手写 | spring事务
查看>>
AndroidStudio Gradle手动下载
查看>>
SpringBoot入门(二)场景启动器
查看>>
SpringBoot入门--自动配置
查看>>
springboot读取配置文件 例:读取配置文件的优先顺序;在主配置文件中激活其他配置文件;加载非主配置文件
查看>>
自动配置原理
查看>>
TCP协议
查看>>
关于Linux系统使用遇到的问题-1:vi 打开只读(readonly)文件如何退出保存?
查看>>
redis 持久化详解,RDB和AOF是什么?他们优缺点是什么?运行流程是什么?
查看>>