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 相关文章推荐
javascript克隆对象深度介绍
Nov 20 Javascript
javascript中的document.open()方法使用介绍
Oct 09 Javascript
node.js+express制作网页计算器
Jan 17 Javascript
js简单设置与使用cookie的方法
Jan 22 Javascript
JavaScript使用链式方法封装jQuery中CSS()方法示例
Apr 07 jQuery
AngularJS 单选框及多选框的双向动态绑定
Apr 20 Javascript
原生JavaScript实现todolist功能
Mar 02 Javascript
JavaScript私有变量实例详解
Jan 24 Javascript
JS实现点击li标签弹出对应的索引功能【案例】
Feb 18 Javascript
Vue 实例事件简单示例
Sep 19 Javascript
node.js中Buffer缓冲器的原理与使用方法分析
Nov 23 Javascript
Vue 数据绑定的原理分析
Nov 16 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调试的强悍利器之PHPDBG
2016/02/22 PHP
YII Framework框架教程之缓存用法详解
2016/03/14 PHP
在b/s开发中经常用到的javaScript技术
2006/08/23 Javascript
浏览器无法运行JAVA脚本的解决方法
2008/01/09 Javascript
jQuery编辑器KindEditor4.1.4代码高亮显示设置教程
2013/03/01 Javascript
javascript实现TreeView 无刷新展开的实例代码
2013/07/13 Javascript
window.showModalDialog()返回值的学习心得总结
2014/01/07 Javascript
用js判断输入是否为中文的函数
2014/03/10 Javascript
Node.js中使用Log.io在浏览器中实时监控日志(等同tail -f命令)
2014/09/17 Javascript
javascript实现10个球随机运动、碰撞实例详解
2015/07/08 Javascript
jquery ajax分页插件的简单实现
2016/01/27 Javascript
利用Plupload.js解决大文件上传问题, 带进度条和背景遮罩层
2017/03/15 Javascript
jQuery实现字体颜色渐变效果的方法
2017/03/29 jQuery
详解vue 单页应用(spa)前端路由实现原理
2018/04/04 Javascript
微信小程序实现折叠展开效果
2018/07/19 Javascript
JavaScript ES6箭头函数使用指南
2018/12/30 Javascript
vue配置nprogress实现页面顶部进度条
2019/09/21 Javascript
JavaScript实现HTML导航栏下拉菜单
2020/11/25 Javascript
Python中逗号的三种作用实例分析
2015/06/08 Python
Python之Scrapy爬虫框架安装及使用详解
2017/11/16 Python
基于python指定包的安装路径方法
2018/10/27 Python
Python minidom模块用法示例【DOM写入和解析XML】
2019/03/25 Python
python爬虫开发之使用python爬虫库requests,urllib与今日头条搜索功能爬取搜索内容实例
2020/03/10 Python
python实现输入三角形边长自动作图求面积案例
2020/04/12 Python
德国受欢迎的旅游和休闲网站:lastminute.de
2019/09/23 全球购物
新郎新娘婚礼答谢词
2014/01/11 职场文书
写给女朋友的道歉信
2014/01/12 职场文书
工程负责人任命书
2014/06/06 职场文书
就业协议书样本
2014/08/20 职场文书
群众路线教育实践活动学习心得体会
2014/10/30 职场文书
公司股东出资证明书
2014/11/01 职场文书
父亲节活动总结
2015/02/12 职场文书
施工员岗位职责范本
2015/04/11 职场文书
2015年学校政教工作总结
2015/07/20 职场文书
董事长助理工作总结2015
2015/07/23 职场文书
2016年共产党员个人承诺书
2016/03/24 职场文书