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 相关文章推荐
什么是cookie?js手动创建和存储cookie
May 27 Javascript
js使用html()或text()方法获取设置p标签的显示的值
Aug 01 Javascript
Node.js开发之访问Redis数据库教程
Jan 14 Javascript
JavaScript实现文字与图片拖拽效果的方法
Feb 16 Javascript
JQuery实现左右滚动菜单特效
Sep 28 Javascript
jQuery实现鼠标跟随提示层效果代码(可显示文本,Div,Table,Html等)
Apr 18 Javascript
基于jquery实现即时检查格式是否正确的表单
May 06 Javascript
一览画面点击复选框后获取多个id值的方法
May 30 Javascript
微信小程序websocket实现聊天功能
Mar 30 Javascript
小程序云开发初探(小结)
Oct 24 Javascript
微信小程序实现多选功能
Nov 04 Javascript
Vue跨域请求问题解决方案过程解析
Aug 07 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查询MySQL大量数据的时候内存占用分析
2011/07/22 PHP
安装ImageMagick出现error while loading shared libraries的解决方法
2014/09/23 PHP
Yii2.0高级框架数据库增删改查的一些操作
2015/11/16 PHP
YII2框架中使用RBAC对模块,控制器,方法的权限控制及规则的使用示例
2020/03/18 PHP
获取页面高度,窗口高度,滚动条高度等参数值getPageSize,getPageScroll
2006/09/22 Javascript
jQuery调用AJAX时Get和post公用的乱码解决方法实例说明
2013/06/04 Javascript
setTimeout函数兼容各主流浏览器运行执行效果实例
2013/06/13 Javascript
浅析js设置控件的readonly与enabled属性问题
2013/12/25 Javascript
javascript图片相似度算法实现 js实现直方图和向量算法
2014/01/14 Javascript
JavaScript操作Cookie详解
2015/02/28 Javascript
jQuery实现checkbox全选的方法
2015/06/10 Javascript
JQuery实现左右滚动菜单特效
2015/09/28 Javascript
手机端实现Bootstrap简单图片轮播效果
2016/10/13 Javascript
最好用的Bootstrap fileinput.js文件上传组件
2016/12/12 Javascript
详解Vue自定义过滤器的实现
2017/01/10 Javascript
JavaScript中常见的八个陷阱总结
2017/06/28 Javascript
深入浅析Vue.js中 computed和methods不同机制
2018/03/22 Javascript
原生js实现移动端Touch轮播图的方法步骤
2019/01/03 Javascript
python基础教程之获取本机ip数据包示例
2014/02/10 Python
详解Python的迭代器、生成器以及相关的itertools包
2015/04/02 Python
Python中tell()方法的使用详解
2015/05/24 Python
python3.5 email实现发送邮件功能
2018/05/22 Python
python实现图片中文字分割效果
2019/07/22 Python
pytorch多进程加速及代码优化方法
2019/08/19 Python
基于Python数据结构之递归与回溯搜索
2020/02/26 Python
Python3中的tuple函数知识点讲解
2021/01/03 Python
Web页面中八种创建多列等高(等高列布局)的实现技术
2012/12/24 HTML / CSS
Speedo速比涛德国官方网站:世界领先的泳装品牌
2019/08/26 全球购物
小学数学教学反思
2014/02/02 职场文书
吨的认识教学反思
2014/04/27 职场文书
园艺师求职信
2014/04/27 职场文书
培训心得体会怎么写
2016/01/25 职场文书
python字符串常规操作大全
2021/05/02 Python
聊聊golang中多个defer的执行顺序
2021/05/08 Golang
PYTHON使用Matplotlib去实现各种条形图的绘制
2022/03/22 Python
nginx静态资源的服务器配置方法
2022/07/07 Servers