JS加载器如何动态加载外部js文件


Posted in Javascript onMay 26, 2016

今天在网上找到了一个可以动态加载js文件的js加载器,具体代码如下:

JsLoader.js

var MiniSite=new Object();
/**
* 判断浏览器
*/
MiniSite.Browser={ 
ie:/msie/.test(window.navigator.userAgent.toLowerCase()), 
moz:/gecko/.test(window.navigator.userAgent.toLowerCase()), 
opera:/opera/.test(window.navigator.userAgent.toLowerCase()), 
safari:/safari/.test(window.navigator.userAgent.toLowerCase()) 
};
/**
* JsLoader对象用来加载外部的js文件
*/
MiniSite.JsLoader={
/**
* 加载外部的js文件
* @param sUrl 要加载的js的url地址
* @fCallback js加载完成之后的处理函数
*/
load:function(sUrl,fCallback){ 
var _script=document.createElement('script'); 
_script.setAttribute('charset','gbk'); 
_script.setAttribute('type','text/javascript'); 
_script.setAttribute('src',sUrl); 
document.getElementsByTagName('head')[].appendChild(_script); 
if(MiniSite.Browser.ie){ 
_script.onreadystatechange=function(){ 
if(this.readyState=='loaded'||this.readyStaate=='complete'){ 
//fCallback();
if(fCallback!=undefined){
fCallback(); 
}
} 
}; 
}else if(MiniSite.Browser.moz){ 
_script.onload=function(){ 
//fCallback(); 
if(fCallback!=undefined){
fCallback(); 
}
}; 
}else{ 
//fCallback();
if(fCallback!=undefined){
fCallback(); 
}
} 
} 
};

JsLoader.js测试

<!DOCTYPE HTML>
<html>
<head>
<!--引入js加载器 -->
<script type="text/javascript" src="js/JsLoader.js"></script>
<title>JsLoaderTest.html</title>
<script type="text/javascript">
if(MiniSite.Browser.ie){
//动态加载Js
MiniSite.JsLoader.load("js/jquery-...js",function(){
alert("动态加载的是jquery-...js");
$(function(){
alert("jquery-...js动态加载完成之后做的处理操作");
});
}); 
}else{
MiniSite.JsLoader.load("js/jquery-...js",function(){
alert("动态加载的是jquery-...js");
$(function(){
alert("jquery-...js动态加载完成之后做的处理操作");
});
});
}
</script>
</head>
<body>
</body>
</html>

测试结果如下:

JS加载器如何动态加载外部js文件

Javascript 相关文章推荐
分享几个超级震憾的图片特效
Jan 08 Javascript
js四舍五入数学函数round使用实例
May 09 Javascript
PHPExcel中的一些常用方法汇总
Jan 23 Javascript
angularjs学习笔记之三大模块(modal,controller,view)
Sep 26 Javascript
jQuery原理系列-常用Dom操作详解
Jun 07 Javascript
浅谈JS正则表达式的RegExp对象和括号的使用
Jul 28 Javascript
利用CSS、JavaScript及Ajax实现图片预加载的方法
Nov 29 Javascript
jQuery加载及解析XML文件的方法实例分析
Jan 22 Javascript
D3.js中强制异步文件读取同步的几种方法
Feb 06 Javascript
js实现旋转木马效果
Mar 17 Javascript
vue的滚动条插件实现代码
Sep 07 Javascript
JS Web Flex弹性盒子模型代码实例
Mar 10 Javascript
jquery获取复选框的值的简单实例
May 26 #Javascript
改变checkbox默认选中状态及取值的实现代码
May 26 #Javascript
JavaScript数组实现数据结构中的队列与堆栈
May 26 #Javascript
jquery获取复选框checkbox的值的简单实现方法
May 26 #Javascript
jquery判断checkbox是否选中及改变checkbox状态的实现方法
May 26 #Javascript
jquery获取所有选中的checkbox实现代码
May 26 #Javascript
JQuery点击行tr实现checkBox选中的简单实例
May 26 #Javascript
You might like
PHP投票系统防刷票判断流程分析
2012/02/04 PHP
Thinkphp 框架扩展之Widget扩展实现方法分析
2020/04/23 PHP
javascript中的nextSibling使用陷(da)阱(keng)
2014/05/05 Javascript
JS实现模拟风力的雪花飘落效果
2015/05/13 Javascript
Javascript中匿名函数的调用与写法实例详解(多种)
2016/01/26 Javascript
快速解决jquery.touchSwipe左右滑动和垂直滚动条冲突
2016/04/15 Javascript
值得分享和收藏的Bootstrap学习教程
2016/05/12 Javascript
JavaScript实现输入框与清空按钮联动效果
2016/09/09 Javascript
微信小程序 本地数据存储实例详解
2017/04/13 Javascript
最通俗易懂的javascript变量提升详解
2017/08/05 Javascript
node.js操作MongoDB的实例详解
2017/10/11 Javascript
layui radio性别单选框赋值方法
2018/08/15 Javascript
JavaScript实现动态留言板
2020/03/16 Javascript
JavaScript的垃圾回收机制与内存管理
2020/08/06 Javascript
vue axios请求成功却进入catch的原因分析
2020/09/08 Javascript
10分钟学会js处理json的常用方法
2020/12/06 Javascript
Python修改文件往指定行插入内容的实例
2019/01/30 Python
python3在同一行内输入n个数并用列表保存的例子
2019/07/20 Python
Python计算IV值的示例讲解
2020/02/28 Python
关于Python 中的时间处理包datetime和arrow的方法详解
2020/03/19 Python
Django如何使用redis作为缓存
2020/05/21 Python
用Python进行websocket接口测试
2020/10/16 Python
如何基于Python pygame实现动画跑马灯
2020/11/18 Python
python解决OpenCV在读取显示图片的时候闪退的问题
2021/02/23 Python
matplotlib阶梯图的实现(step())
2021/03/02 Python
Lookfantastic西班牙官网:英国知名美妆购物网站
2018/06/13 全球购物
应征英语教师求职信
2013/11/27 职场文书
庆中秋节主题活动方案
2014/02/03 职场文书
出纳试用期自我鉴定
2014/04/07 职场文书
毕业证委托书范文
2014/09/26 职场文书
班子群众路线教育实践个人对照检查材料思想汇报
2014/09/30 职场文书
2014年大班保育员工作总结
2014/12/02 职场文书
巾帼标兵事迹材料
2014/12/26 职场文书
作弊检讨书
2015/01/27 职场文书
SQL SERVER触发器详解
2022/02/24 SQL Server
SQLServer权限之只开启创建表权限
2022/04/12 SQL Server