js 判断脚本加载完毕的代码


Posted in Javascript onJuly 13, 2011
if(this.isIE) { 
js.onreadystatechange=function(){if(js.readyState=="loaded" || js.readyState=="complete") callback();} 
}else{js.onload=function(){callback();}} 
js.onerror=function(){alert('Not Found (404): '+src)}//chrome

JS判断脚本是否加载完成

在“按需加载”的需求中,我们经常会判断当脚本加载完成时,返回一个回调函数,那如何去判断脚本的加载完成呢?
我们可以对加载的 JS 对象使用 onload 来判断(js.onload),此方法 Firefox2、Firefox3、Safari3.1+、Opera9.6+ 浏览器都能很好的支持,但 IE6、IE7 却不支持。曲线救国 —— IE6、IE7 我们可以使用 js.onreadystatechange 来跟踪每个状态变化的情况(一般为 loading 、loaded、interactive、complete),当返回状态为 loaded 或 complete 时,则表示加载完成,返回回调函数。
对于 readyState 状态需要一个补充说明:
在 interactive 状态下,用户可以参与互动。
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('https://3water.com/jslib//jquery/jquery.js');
Javascript 相关文章推荐
jQuery下扩展插件和拓展函数的写法(匿名函数使用的典型例子)
Oct 20 Javascript
jQuery学习笔记之 Ajax操作篇(三) - 过程处理
Jun 23 Javascript
JavaScript中用字面量创建对象介绍
Dec 31 Javascript
JavaScript对数字的判断与处理实例分析
Feb 02 Javascript
JQUERY简单按钮轮换选中效果实现方法
May 07 Javascript
jQuery点击改变class并toggle及toggleClass()方法定义用法
Dec 11 Javascript
JQuery核心函数是什么及使用方法介绍
May 03 Javascript
Jquery Easyui表单组件Form使用详解(30)
Dec 19 Javascript
JavaScript原型对象、构造函数和实例对象功能与用法详解
Aug 04 Javascript
vue-cli 3.0 版本与3.0以下版本在搭建项目时的区别详解
Dec 11 Javascript
js实现倒计时器自定义时间和暂停
Feb 25 Javascript
Vue OpenLayer测距功能的实现
Apr 20 Vue.js
关于js拖拽上传 [一个拖拽上传修改头像的流程]
Jul 13 #Javascript
使用 JScript 创建 .exe 或 .dll 文件的方法
Jul 13 #Javascript
JS模拟面向对象全解(二、类型与赋值)
Jul 13 #Javascript
JS模拟面向对象全解(一、类型及传递)
Jul 13 #Javascript
一些实用的jQuery代码片段收集
Jul 12 #Javascript
formValidator3.3的ajaxValidator一些异常分析
Jul 12 #Javascript
在IE浏览器中resize事件执行多次的解决方法
Jul 12 #Javascript
You might like
分享下页面关键字抓取components.arrow.com站点代码
2014/01/30 PHP
PHP函数addslashes和mysql_real_escape_string的区别
2014/04/22 PHP
什么情况下可以不写PHP的闭合标签“?>”
2014/08/28 PHP
PHP curl 抓取AJAX异步内容示例
2014/09/09 PHP
PHP常用工具类大全附全部代码下载
2015/12/07 PHP
PHP 以POST方式提交XML、获取XML,解析XML详解及实例
2016/10/26 PHP
Nigma vs Alliance BO5 第三场2.14
2021/03/10 DOTA
JS处理VBArray的函数使用说明
2008/05/11 Javascript
html超链接打开窗口大小的方法
2013/03/05 Javascript
JS关闭窗口或JS关闭页面的几种代码分享
2013/10/25 Javascript
js隐式全局变量造成的bug示例代码
2014/04/22 Javascript
一个判断抢购时间是否到达的简单的js函数
2014/06/23 Javascript
JavaScript获取鼠标移动时的坐标(兼容IE8、chome谷歌、Firefox)
2014/09/13 Javascript
JS实现点击上移下移LI行数据的方法
2015/08/05 Javascript
详解AngularJS Filter(过滤器)用法
2015/12/28 Javascript
实例讲解避免javascript冲突的方法
2016/01/03 Javascript
详解js的事件处理函数和动态创建html标记方法
2016/12/16 Javascript
JavaScript截屏功能的实现代码
2017/07/28 Javascript
在Python中操作字符串之startswith()方法的使用
2015/05/20 Python
详解Python中 __get__和__getattr__和__getattribute__的区别
2016/06/16 Python
Python DataFrame设置/更改列表字段/元素类型的方法
2018/06/09 Python
python 读取文件并替换字段的实例
2018/07/12 Python
python实现汽车管理系统
2018/11/30 Python
Django+boostrap 美化admin后台的操作
2020/03/11 Python
tensorflow2.0的函数签名与图结构(推荐)
2020/04/28 Python
在echarts中图例legend和坐标系grid实现左右布局实例
2020/05/16 Python
如何使用python自带IDLE的几种方法
2020/10/10 Python
详解Python流程控制语句
2020/10/28 Python
巴西在线鞋店:Shoestock
2017/10/28 全球购物
物流仓储计划书
2014/01/10 职场文书
淘宝店铺营销方案
2014/02/13 职场文书
幼儿园优秀班主任事迹材料
2014/05/14 职场文书
法定代表人授权委托书范文
2014/08/02 职场文书
网络文明传播志愿者活动方案
2014/08/20 职场文书
安全保卫工作竞聘材料
2014/08/25 职场文书
九年级化学教学反思
2016/02/22 职场文书