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 相关文章推荐
js几个验证函数代码
Mar 25 Javascript
Javascript中定义方法的另类写法(批量定义js对象的方法)
Feb 25 Javascript
整理的比较全的event对像在ie与firefox浏览器中的区别
Nov 25 Javascript
jQuery Uploadify 上传插件出现Http Error 302 错误的解决办法
Dec 12 Javascript
jquery.serialize() 函数语法及简单实例
Jul 08 Javascript
js返回顶部实例分享
Dec 21 Javascript
jQuery实现鼠标悬停3d菜单展开动画效果
Jan 19 Javascript
Angular模版驱动表单的使用总结
May 05 Javascript
详解vue 图片上传功能
Apr 30 Javascript
layui监听单元格编辑前后交互的例子
Sep 16 Javascript
Element Badge标记的使用方法
Jul 27 Javascript
jQuery实现滑动开关效果
Aug 02 jQuery
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
德生9700DX电路分析
2021/03/02 无线电
openflashchart 2.0 简单案例php版
2012/05/21 PHP
深入解析PHP垃圾回收机制对内存泄露的处理
2013/06/14 PHP
PHP实现的memcache环形队列类实例
2015/07/28 PHP
PHP+MySql+jQuery实现的&quot;顶&quot;和&quot;踩&quot;投票功能
2016/05/21 PHP
PHP弱类型的安全问题详细总结
2016/09/25 PHP
PHP实现向关联数组指定的Key之前插入元素的方法
2017/06/06 PHP
理解 JavaScript 预解析
2009/10/25 Javascript
JS控制图片翻转示例代码(兼容firefox,ie,chrome)
2013/12/19 Javascript
js查找某元素中的所有图片地址的方法
2014/01/16 Javascript
javascript实现微信分享
2014/12/23 Javascript
js表头排序实现方法
2015/01/16 Javascript
JavaScript自动点击链接 防止绕过浏览器访问的方法
2017/01/19 Javascript
jQuery树控件zTree使用方法详解(一)
2017/02/28 Javascript
jquery实现一个全局计时器(商城可用)
2017/06/30 jQuery
Vue学习笔记进阶篇之过渡状态详解
2017/07/14 Javascript
Vue入门之数据绑定(小结)
2018/01/08 Javascript
基于vue v-for 循环复选框-默认勾选第一个的实现方法
2018/03/03 Javascript
node基于puppeteer模拟登录抓取页面的实现
2018/05/09 Javascript
vue中如何实现后台管理系统的权限控制的方法步骤
2019/09/05 Javascript
js中的面向对象之对象常见创建方法详解
2019/12/16 Javascript
Node在Controller层进行数据校验的过程详解
2020/08/28 Javascript
[00:33]2016完美“圣”典风云人物:BurNIng宣传片
2016/12/10 DOTA
[00:12]2018DOTA2亚洲邀请赛SOLO赛 MidOne是否中单第一人?
2018/04/05 DOTA
Python 两个列表的差集、并集和交集实现代码
2016/09/21 Python
python将txt等文件中的数据读为numpy数组的方法
2018/12/22 Python
解决django migrate报错ORA-02000: missing ALWAYS keyword
2020/07/02 Python
Python Spyder 调出缩进对齐线的操作
2021/02/26 Python
10分钟理解CSS3 Grid布局
2018/12/20 HTML / CSS
悦木之源美国官网:Origins美国
2016/08/01 全球购物
公司成立感言
2014/01/11 职场文书
小学教师管理制度
2014/01/18 职场文书
幼儿园标语大全
2014/06/19 职场文书
2014年银行员工工作总结
2014/11/12 职场文书
Python爬虫之爬取最新更新的小说网站
2021/05/06 Python
Go语言并发编程 sync.Once
2021/10/16 Golang