判断脚本加载是否完成的方法

 更新时间:2009年05月26日 02:08:43   作者:  
在“按需加载”的需求中,我们经常会判断当脚本加载完成时,返回一个回调函数,那如何去判断脚本的加载完成呢?
我们可以对加载的 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 function
include_js('http://img.jb51.net/jslib/jquery/jquery-1.3.2.min.js);

相关文章

  • 微信小程序实现事件传参与数据同步流程详解

    微信小程序实现事件传参与数据同步流程详解

    这篇文章主要介绍了微信小程序开发中实现事件传参与数据同步的详细流程,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习吧
    2022-10-10
  • 送你43道JS面试题(收藏)

    送你43道JS面试题(收藏)

    这篇文章主要介绍了送你43道JS面试题,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-06-06
  • javascript强制点击广告的方法

    javascript强制点击广告的方法

    这篇文章主要介绍了javascript强制点击广告的方法,可用于下载站或文档显示站,实现点击后才能出现相应显示的功能,非常具有实用价值,需要的朋友可以参考下
    2015-02-02
  • 通过修改360抢票的刷新频率和突破8车次限制实现方法

    通过修改360抢票的刷新频率和突破8车次限制实现方法

    这篇文章主要介绍了通过修改360抢票的刷新频率和突破8车次限制实现方法的相关资料,现在刷票工具很多,这里就举一例修改,增加抢票频率及突破8车次限制,需要的朋友可以参考下
    2017-01-01
  • js同时按下两个方向键

    js同时按下两个方向键

    本文通过实例代码给大家介绍了js同时按下两个方向键的实现方法,感兴趣的朋友跟随脚本之家小编一起看看吧
    2007-12-12
  • js正则表达式验证密码强度【推荐】

    js正则表达式验证密码强度【推荐】

    本文主要介绍了js利用正则表达式验证密码强度的实例,具有很好的参考价值。下面跟着小编一起来看下吧
    2017-03-03
  • JavaScript将字符串转换为整数的方法

    JavaScript将字符串转换为整数的方法

    这篇文章主要介绍了JavaScript将字符串转换为整数的方法,涉及javascript中parseInt函数的使用技巧,非常具有实用价值,需要的朋友可以参考下
    2015-04-04
  • webpack+vue-cil中proxyTable处理跨域的方法

    webpack+vue-cil中proxyTable处理跨域的方法

    这篇文章主要介绍了webpack+vue-cil中proxyTable处理跨域的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-07-07
  • es6处理数组的方法汇总(非常详细)

    es6处理数组的方法汇总(非常详细)

    ES6中引入了一些新的数组方法,例如:Array.of(),Array.from()等,下面这篇文章主要给大家介绍了关于es6处理数组的方法汇总,需要的朋友可以参考下
    2023-06-06
  • Bootstrap提示框效果的实例代码

    Bootstrap提示框效果的实例代码

    本篇文章主要介绍了Bootstrap提示框效果的实例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-07-07

最新评论