JS加載器如何動(dòng)態(tài)加載外部js文件
更新時(shí)間：2016年05月26日 11:30:11 作者：孤傲蒼狼
這篇文章主要介紹了JS加載器如何動(dòng)態(tài)加載外部js文件的相關(guān)資料,需要的朋友可以參考下
今天在網(wǎng)上找到了一個(gè)可以動(dòng)態(tài)加載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對(duì)象用來(lái)加載外部的js文件
*/
MiniSite.JsLoader={
/**
* 加載外部的js文件
* @param sUrl 要加載的js的url地址
* @fCallback js加載完成之后的處理函數(shù)
*/
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測(cè)試
<!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){
//動(dòng)態(tài)加載Js
MiniSite.JsLoader.load("js/jquery-...js",function(){
alert("動(dòng)態(tài)加載的是jquery-...js");
$(function(){
alert("jquery-...js動(dòng)態(tài)加載完成之后做的處理操作");
});
});
}else{
MiniSite.JsLoader.load("js/jquery-...js",function(){
alert("動(dòng)態(tài)加載的是jquery-...js");
$(function(){
alert("jquery-...js動(dòng)態(tài)加載完成之后做的處理操作");
});
});
}
</script>
</head>
<body>
</body>
</html>
測(cè)試結(jié)果如下：
您可能感興趣的文章:
- 動(dòng)態(tài)加載JS文件的三種方法
- jquery及js實(shí)現(xiàn)動(dòng)態(tài)加載js文件的方法
- 用ajax動(dòng)態(tài)加載需要的js文件
- 如何實(shí)現(xiàn)JavaScript動(dòng)態(tài)加載CSS和JS文件
- JS 動(dòng)態(tài)加載js文件和css文件 同步/異步的兩種簡(jiǎn)單方式
- javascript中動(dòng)態(tài)加載js文件多種解決辦法總結(jié)
- 使用javaScript動(dòng)態(tài)加載Js文件和Css文件
- 理解javascript中的回調(diào)函數(shù)(callback)
- js 異步操作回調(diào)函數(shù)如何控制執(zhí)行順序
- javascript 自定義回調(diào)函數(shù)示例代碼
- 原生JS實(shí)現(xiàn)動(dòng)態(tài)加載js文件并在加載成功后執(zhí)行回調(diào)函數(shù)的方法
相關(guān)文章
layui點(diǎn)擊左側(cè)導(dǎo)航欄,實(shí)現(xiàn)不刷新整個(gè)頁(yè)面,只刷新局部的方法
今天小編就為大家分享一篇layui點(diǎn)擊左側(cè)導(dǎo)航欄,實(shí)現(xiàn)不刷新整個(gè)頁(yè)面,只刷新局部的方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-09-09
JavaScript 函數(shù)節(jié)流詳解及方法總結(jié)
這篇文章主要介紹了JavaScript 函數(shù)節(jié)流詳解及實(shí)例的相關(guān)資料,需要的朋友可以參考下2017-02-02
javascript實(shí)現(xiàn)用戶管理系統(tǒng)
這篇文章主要為大家詳細(xì)介紹了javascript實(shí)現(xiàn)用戶管理系統(tǒng)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-06-06
微信小程序?qū)崿F(xiàn)全局狀態(tài)管理的方法整理
已知微信小程序中如果要做到全局狀態(tài)共享，常用的有四種方式，分別是globalData、本地緩存、mobx-miniprogram和westore，本文將帶大家看看mobx-miniprogram是如何實(shí)現(xiàn)的小程序的全局狀態(tài)管理，需要的可以收藏一下2023-06-06
今天小編就為大家分享一篇關(guān)于js中對(duì)象和面向?qū)ο笈cJson介紹，小編覺(jué)得內(nèi)容挺不錯(cuò)的，現(xiàn)在分享給大家，具有很好的參考價(jià)值，需要的朋友一起跟隨小編來(lái)看看吧2019-01-01
這篇文章主要為大家詳細(xì)介紹了JavaScript分頁(yè)組件使用方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-07-07
webpack打包優(yōu)化的幾個(gè)方法總結(jié)
這篇文章主要介紹了webpack打包優(yōu)化的幾個(gè)方法總結(jié)，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-02-02
微信小程序用戶后臺(tái)定位及錄音授權(quán)及請(qǐng)求示例
這篇文章主要為大家介紹了微信小程序用戶后臺(tái)定位及錄音授權(quán)及請(qǐng)求示例，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-04-04
webpack打包時(shí)如何修改文件名的實(shí)現(xiàn)示例
本文主要介紹了webpack打包時(shí)如何修改文件名的實(shí)現(xiàn)示例，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2022-06-06