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 相关文章推荐
一个刚完成的layout(拖动流畅,不受iframe影响)
Aug 17 Javascript
javascript获取当前ip的代码
May 10 Javascript
jquery中ajax函数执行顺序问题之如何设置同步
Feb 28 Javascript
JS实现控制表格只显示行边框或者只显示列边框的方法
Mar 31 Javascript
js图片卷帘门导航菜单特效代码分享
Sep 10 Javascript
详解JavaScript语言的基本语法要求
Nov 20 Javascript
jquery获取css的color值返回RGB的方法
Dec 18 Javascript
理解AngularJs篇:30分钟快速掌握AngularJs
Dec 23 Javascript
JavaScript原生数组Array常用方法
Apr 06 Javascript
js事件委托和事件代理案例分享
Jul 25 Javascript
nvm、nrm、npm 安装和使用详解(小结)
Jan 17 Javascript
node.js通过Sequelize 连接MySQL的方法
Dec 28 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中处理mysql_fetch_assoc返回来的数组 不用foreach----echo
2011/05/04 PHP
php提示Call-time pass-by-reference has been deprecated in的解决方法[已测]
2012/05/06 PHP
Centos 6.5下PHP 5.3安装ffmpeg扩展的步骤详解
2017/03/02 PHP
php基于环形链表解决约瑟夫环问题示例
2017/11/07 PHP
JAVASCRIPT模式窗口中下载文件无法接收iframe的流
2013/10/11 Javascript
原生JavaScript实现合并多个数组示例
2014/09/21 Javascript
41个Web开发者必须收藏的JavaScript实用技巧
2016/07/22 Javascript
20分钟打造属于你的Bootstrap站点
2016/07/27 Javascript
JS封装的三级联动菜单(使用时只需要一行js代码)
2016/10/24 Javascript
easyui datebox 时间限制,datebox开始时间限制结束时间,datebox截止日期比起始日期大的实现代码
2017/01/12 Javascript
Javascript 一些需要注意的细节(必看篇)
2017/07/08 Javascript
python逐行读取文件内容的三种方法
2014/01/20 Python
Python3基础之条件与循环控制实例解析
2014/08/13 Python
Python下的subprocess模块的入门指引
2015/04/16 Python
Python内置函数OCT详解
2016/11/09 Python
浅谈Python peewee 使用经验
2017/10/20 Python
python的unittest测试类代码实例
2017/12/07 Python
如何使用VSCode愉快的写Python于调试配置步骤
2018/04/06 Python
PyQt5每天必学之像素图控件QPixmap
2018/04/19 Python
python爬取网易云音乐评论
2018/11/16 Python
利用Python+阿里云实现DDNS动态域名解析的方法
2019/04/01 Python
django Admin文档生成器使用详解
2019/07/22 Python
提升Python效率之使用循环机制代替递归函数
2019/07/23 Python
查看keras的默认backend实现方式
2020/06/19 Python
python和C++共享内存传输图像的示例
2020/10/27 Python
python 调整图片亮度的示例
2020/12/03 Python
CSS3实现淘宝留白的方法
2020/06/05 HTML / CSS
新西兰廉价汽车租赁:Snap Rentals
2018/09/14 全球购物
LN-CC日本:高端男装和女装的奢侈时尚目的地
2019/09/01 全球购物
婚鞋、新娘鞋、礼服鞋、童鞋:Nina Shoes
2019/09/04 全球购物
求职信范文怎么写
2014/01/29 职场文书
小学毕业典礼主持词
2014/03/27 职场文书
玄武湖导游词
2015/02/05 职场文书
2015年爱国卫生月活动总结
2015/03/26 职场文书
成绩单家长意见
2015/06/03 职场文书
2019新学期家长会工作计划
2019/08/21 职场文书