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浮动DIV提示信息并自动隐藏的代码
Aug 29 Javascript
jquery ajax 同步异步的执行 return值不能取得的解决方案
Jan 08 Javascript
input输入框的自动匹配(原生代码)
Mar 19 Javascript
Javascript获取当前日期的农历日期代码
Oct 08 Javascript
js实现文本框支持加减运算的方法
Aug 19 Javascript
javascript正则表达式定义(语法)总结
Jan 08 Javascript
javascript对象的创建和访问
Mar 08 Javascript
jsp 网站引入外部css或者js失效问题解决
Oct 31 Javascript
jQuery简单自定义图片轮播插件及用法示例
Nov 21 Javascript
老生常谈javascript的面向对象思想
Aug 22 Javascript
JavaScript正则表达式函数总结(常用)
Feb 22 Javascript
Javascript组合继承方法代码实例解析
Apr 02 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
全国FM电台频率大全 - 27 陕西省
2020/03/11 无线电
详解PHP显示MySQL数据的三种方法
2008/06/05 PHP
php面向对象全攻略 (一) 面向对象基础知识
2009/09/30 PHP
解析php通过cookies获取远程网页的指定代码
2013/06/25 PHP
php判断页面是否是微信打开的示例(微信打开网页)
2014/04/25 PHP
php使用Jpgraph绘制简单X-Y坐标图的方法
2015/06/10 PHP
thinkPHP+mysql+ajax实现的仿百度一下即时搜索效果详解
2019/07/15 PHP
二级域名转向类
2006/11/09 Javascript
灵活应用js调试技巧解决样式问题的步骤分享
2012/03/15 Javascript
jquery增加和删除元素的方法
2015/01/14 Javascript
深入分析Cookie的安全性问题
2015/03/01 Javascript
javascript中动态函数用法实例分析
2015/05/14 Javascript
使用Script元素发送JSONP请求的方法
2016/06/12 Javascript
jQuery实现日期联动效果实例
2016/07/26 Javascript
javascript简单写的判断电话号码实例
2017/05/24 Javascript
jQuery中ajax获取数据赋值给页面的实例
2017/12/31 jQuery
vue 虚拟dom的patch源码分析
2018/03/01 Javascript
Vue 动态设置路由参数的案例分析
2018/04/24 Javascript
ES6数组与对象的解构赋值详解
2019/06/14 Javascript
原生js实现俄罗斯方块
2020/10/20 Javascript
一起深入理解js中的事件对象
2021/02/06 Javascript
python 图片验证码代码
2008/12/07 Python
Python3中使用PyMongo的方法详解
2017/07/28 Python
NLTK 3.2.4 环境搭建教程
2018/09/19 Python
Python增强赋值和共享引用注意事项小结
2019/05/28 Python
tensorflow如何批量读取图片
2019/08/29 Python
如何将你的应用迁移到Python3的三个步骤
2019/12/22 Python
如何使用Python进行PDF图片识别OCR
2021/01/22 Python
青年教师典范事迹材料
2014/01/31 职场文书
三爱活动实施方案
2014/03/19 职场文书
小学向国旗敬礼活动方案
2014/09/27 职场文书
大学毕业典礼致辞
2015/07/29 职场文书
护理心得体会范文
2016/01/22 职场文书
工作自我评价范文
2019/03/21 职场文书
java objectUtils 使用可能会出现的问题
2022/02/28 Java/Android
Win10系统搭建ftp文件服务器详细教程
2022/08/05 Servers