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 相关文章推荐
JavaScript 嵌套函数指向this对象错误的解决方法
Mar 15 Javascript
jquery ajax post提交数据乱码
Nov 05 Javascript
引用其它js时如何同时处理多个window.onload事件
Sep 02 Javascript
seajs加载jquery时提示$ is not a function该怎么解决
Oct 23 Javascript
Javascript获取数组中的最大值和最小值的方法汇总
Jan 01 Javascript
AngularJs  Using $location详解及示例代码
Sep 02 Javascript
Bootstrap栅格系统的使用和理解2
Dec 14 Javascript
详解Jquery的事件操作和文档操作
Dec 19 Javascript
jquery实现一个全局计时器(商城可用)
Jun 30 jQuery
vue中slot(插槽)的介绍与使用
Nov 12 Javascript
Vue在H5 项目中使用融云进行实时个人单聊通讯
Dec 14 Vue.js
类和原型的设计模式之复制与委托差异
Jul 07 Javascript
关于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
解析PHP正则提取或替换img标记属性
2013/06/26 PHP
php模拟服务器实现autoindex效果的方法
2015/03/10 PHP
PHP随手笔记整理之PHP脚本和JAVA连接mysql数据库
2015/11/25 PHP
JQERY limittext 插件0.2版(长内容限制显示)
2010/08/27 Javascript
基于JQuery实现的Select级联
2014/01/27 Javascript
JS中判断null、undefined与NaN的方法
2014/03/24 Javascript
js检测输入内容全为空格的方法
2014/05/03 Javascript
JavaScript操作Oracle数据库示例
2015/03/06 Javascript
js创建数组的简单方法
2016/07/27 Javascript
使用Browserify来实现CommonJS的浏览器加载方法
2017/05/14 Javascript
javascript中mouseenter与mouseover的异同
2017/06/06 Javascript
基于AngularJS的拖拽文件上传的实例代码
2017/07/15 Javascript
jQuery滚动条美化插件nicescroll简单用法示例
2018/04/18 jQuery
vue+element+Java实现批量删除功能
2019/04/08 Javascript
简述vue-cli中chainWebpack的使用方法
2019/07/30 Javascript
js实现搜索提示框效果
2020/09/05 Javascript
python类型强制转换long to int的代码
2013/02/10 Python
Python遍历目录的4种方法实例介绍
2015/04/13 Python
python中for用来遍历range函数的方法
2018/06/08 Python
使用python3调用wxpy模块监控linux日志并定时发送消息给群组或好友
2019/06/05 Python
用python写一个定时提醒程序的实现代码
2019/07/22 Python
Python利用PyExecJS库执行JS函数的案例分析
2019/12/18 Python
Python Selenium异常处理的实例分析
2021/02/28 Python
CSS实现鼠标滑过鼠标点击代码写法
2016/12/26 HTML / CSS
HTML5 和小程序实现拍照图片旋转、压缩和上传功能
2018/10/08 HTML / CSS
巴西儿童时尚购物网站:Dinda
2019/08/14 全球购物
PatPat香港:婴童服饰和亲子全家装在线购物
2020/09/27 全球购物
线程的基本概念、线程的基本状态以及状态之间的关系
2012/10/26 面试题
英文求职信结束语大全
2013/10/26 职场文书
煤矿安全知识竞赛活动总结
2014/07/07 职场文书
见习报告格式要求
2014/11/04 职场文书
2015年挂职锻炼工作总结
2014/12/12 职场文书
玄武湖导游词
2015/02/05 职场文书
实习指导老师意见
2015/06/04 职场文书
科级干部培训心得体会
2016/01/06 职场文书
Python编程根据字典列表相同键的值进行合并
2021/10/05 Python