JS动态插入并立即执行回调函数的方法


Posted in Javascript onApril 21, 2016

本文实例讲述了JS动态插入并立即执行回调函数的方法。分享给大家供大家参考,具体如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<div id="loading">加载中……</div>
<mce:script type="text/JavaScript">
<!--
function loadJs(id,url,callback){
 var script = document.createElement('script');
 script.type = 'text/javascript';
 script.src = url;
 script.id = id;
 script.onload = script.onreadystatechange = function(){
  alert(script.readyState);
  if(script.readyState && script.readyState != 'loaded' && script.readyState != 'complete') return ;
  script.onreadystatechange = script.onload = null
  if(callback) callback();
 }
 document.body.appendChild(script);
}
loadJs('jQuery','jquery.js',function(){$('#loading').html('jquery.js加载完毕')})
// --></mce:script>
</body>
</html>

动态插入js文件在提高页面加载速度和跨域问题上有非常重要的作用。上面就是一个简单例子。

ie 上支持 onreadystatechange , 不支持 onload

firefox上支持 onload , 不支持onreadystatechange

ie上面不一定loaded 或者是 complete触发 , 或者两个都会触发,所以用或来判断。

需要注意的是script.onreadystatechange 和script.readyState 的大小写形式,不区分大小写就可能导致不易发现的错误。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
用javascript操作xml
Nov 04 Javascript
关于Javascript 的 prototype问题。
Jan 03 Javascript
发布BlueShow v1.0 图片浏览器(类似lightbox)blueshow.js 打包下载
Jul 21 Javascript
jQuery EasyUI API 中文文档 - Pagination分页
Sep 29 Javascript
解析URI与URL之间的区别与联系
Nov 22 Javascript
ie7+背景透明文字不透明超级简单的实现方法
Jan 17 Javascript
js控制浏览器全屏示例代码
Feb 20 Javascript
JS中的构造函数详细解析
Mar 10 Javascript
JQuery中的事件及动画用法实例
Jan 26 Javascript
JavaScript实现强制重定向至HTTPS页面
Jun 10 Javascript
javascript日期格式化方法汇总
Oct 04 Javascript
vue2.0实现前端星星评分功能组件实例代码
Feb 12 Javascript
jQuery插件datatables使用教程
Apr 21 #Javascript
JavaScript预解析及相关技巧分析
Apr 21 #Javascript
JavaScript实现显示函数调用堆栈的方法
Apr 21 #Javascript
JS实现队列与堆栈的方法
Apr 21 #Javascript
JS、jQuery中select的用法详解
Apr 21 #Javascript
jQuery中iframe的操作(点击按钮新增窗口)
Apr 20 #Javascript
JS生成某个范围的随机数【四种情况详解】
Apr 20 #Javascript
You might like
提升PHP执行速度全攻略(上)
2006/10/09 PHP
让你同时上传 1000 个文件 (二)
2006/10/09 PHP
第十二节--类的自动加载
2006/11/16 PHP
基于PHP输出缓存(output_buffering)的深入理解
2013/06/13 PHP
PHP 验证码不显示只有一个小红叉的解决方法
2013/09/30 PHP
PHP文件上传类实例详解
2016/04/08 PHP
php简单实现sql防注入的方法
2016/04/22 PHP
ext jquery 简单比较
2010/04/07 Javascript
浅谈javascript控制HTML5的全屏操控,浏览器兼容的问题
2016/10/10 Javascript
AngularJS实现用户登录状态判断的方法(Model添加拦截过滤器,路由增加限制)
2016/12/12 Javascript
js实现表格筛选功能
2017/01/18 Javascript
JS去掉字符串中所有的逗号
2017/10/18 Javascript
javascript代码优化的8点总结
2018/01/29 Javascript
vue-cli构建项目下使用微信分享功能
2018/05/28 Javascript
Vue循环组件加validate多表单验证的实例
2018/09/18 Javascript
vue 弹框产生的滚动穿透问题的解决
2018/09/21 Javascript
[02:54]DOTA2亚洲邀请赛 VG战队出场宣传片
2015/02/07 DOTA
[54:17]DOTA2-DPC中国联赛定级赛 RNG vs iG BO3第二场 1月10日
2021/03/11 DOTA
Python实现partial改变方法默认参数
2014/08/18 Python
使用python实现省市三级菜单效果
2016/01/20 Python
python实现向微信用户发送每日一句 python实现微信聊天机器人
2019/03/27 Python
Python脚本利用adb进行手机控制的方法
2019/07/08 Python
Pandas 重塑(stack)和轴向旋转(pivot)的实现
2019/07/22 Python
使用Python paramiko模块利用多线程实现ssh并发执行操作
2019/12/05 Python
Python如何使用turtle库绘制图形
2020/02/26 Python
CSS3 border-radius圆角的实现方法及用法详解
2020/09/14 HTML / CSS
如何用PHP实现邮件发送
2012/12/26 面试题
电信专业应届生自荐信
2013/09/28 职场文书
珍爱生命演讲稿
2014/05/10 职场文书
企业年度评优方案
2014/06/02 职场文书
如何写股份合作协议书
2014/09/11 职场文书
2014年就业工作总结
2014/11/26 职场文书
优秀员工自荐书
2015/03/06 职场文书
小米11和iphone12哪个值得买?小米11对比iphone12评测
2021/04/21 数码科技
教你快速构建一个基于nginx的web集群项目
2021/11/27 Servers
Windows Server 2008配置防火墙策略详解
2022/06/28 Servers