脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript技巧 → 加载外部js

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

 更新时间：2016年05月26日 11:30:11   作者：孤傲苍狼  
这篇文章主要介绍了JS加载器如何动态加载外部js文件的相关资料,需要的朋友可以参考下

今天在网上找到了一个可以动态加载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>

测试结果如下：

您可能感兴趣的文章:

相关文章

  • ES6的Fetch异步请求的实现方法

    ES6的Fetch异步请求的实现方法

    这篇文章主要介绍了ES6的Fetch异步请求的实现方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
    2018-12-12
  • js 数组的for循环到底应该怎么写？

    js 数组的for循环到底应该怎么写？

    说实话，我是个比较喜欢怀疑权威的人，但是在有些权威的问题一直在我面前闪，闪啊闪，我就开始不怀疑他们了，因为有10000个人说这个东西是对的，我就会觉得它的确是对的吧。
    2010-05-05
  • 微信小程序实现日历签到功能

    微信小程序实现日历签到功能

    这篇文章主要为大家详细介绍了微信小程序实现日历签到功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2022-08-08
  • IE6与IE7中，innerHTML获取param的区别

    IE6与IE7中，innerHTML获取param的区别

    最近，在用一些web编辑器，发现插入一段mp3后，查看源代码，object标签中的param都被删除。下面我演示给大家看看。
    2009-03-03
  • js版扫雷游戏

    js版扫雷游戏

    这篇文章主要为大家详细介绍了js版扫雷游戏，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2022-06-06
  • 原生js实现放大镜组件

    原生js实现放大镜组件

    这篇文章主要为大家详细介绍了js实现放大镜组件，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2021-01-01
  • js 获取、清空input type="file"的值(示例代码)

    js 获取、清空input type="file"的值(示例代码)

    本篇文章主要介绍了js 获取、清空input type="file"的值(示例代码) 需要的朋友可以过来参考下，希望对大家有所帮助
    2013-12-12
  • js与运算符和或运算符的妙用

    js与运算符和或运算符的妙用

    这篇文章主要介绍了js与运算符和或运算符的使用方法,需要的朋友可以参考下
    2014-02-02
  • 实例详解BootStrap的动态模态框及静态模态框

    实例详解BootStrap的动态模态框及静态模态框

    要用bootStrap这个框架就必须要重载它的class类,也就是说class要一样。接下来通过实例代码给大家介绍BootStrap的动态模态框及静态模态框,需要的朋友可以参考下
    2018-08-08
  • 为什么js中不推荐使用eval函数(原因分析)

    为什么js中不推荐使用eval函数(原因分析)

    'eval'函数是javascript中的一个内置函数,它的主要作用是将传入的字符串作为代码来执行,这篇文章主要介绍了为什么js中不推荐使用eval函数,需要的朋友可以参考下
    2023-10-10

最新评论