使用js加载器动态加载外部js、css文件
let 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())
};
/**
* 加载外部的文件
* @param sUrl 要加载的文件的url地址
* @param fileType 要加载的文件的类型
* @fCallback 文件加载完成之后的处理函数
*/
MiniSite.JsLoader = function(sUrl, fileType, fCallback) {
let fileHref;
if (fileType == "js") {
fileHref = document.createElement('script');
fileHref.setAttribute("type", "text/javascript");
fileHref.setAttribute("src", sUrl);
} else if (fileType == "css") {
fileHref = document.createElement('link');
fileHref.setAttribute("rel", "stylesheet");
fileHref.setAttribute("type", "text/css");
fileHref.setAttribute("href", sUrl);
}
if (fileHref !== undefined) {
document.getElementsByTagName("head")[0].appendChild(fileHref);
if (MiniSite.Browser.ie) {
fileHref.onreadystatechange = function() {
if (this.readyState == 'loaded' || this.readyState == 'complete') {
if (fCallback != undefined) {
fCallback();
}
}
};
} else {
fileHref.onload = function() {
if (fCallback != undefined) {
fCallback();
}
};
}
}
}; //动态加载 CSS 文件
MiniSite.JsLoader("/static/css/all.css", "css");
MiniSite.JsLoader("/static/css/base.css", "css");
MiniSite.JsLoader("/static/css/style.css", "css");
//动态加载 JS 文件
MiniSite.JsLoader("https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js", "js", function() {
MiniSite.JsLoader("https://cdn.jsdelivr.net/npm/vue", "js");
MiniSite.JsLoader("/static/js/bootstrap.min.js", "js");
MiniSite.JsLoader("/static/js/bootstrap-table.min.js", "js", function() {
MiniSite.JsLoader("https://cdn.bootcss.com/bootstrap-table/1.12.1/locale/bootstrap-table-zh-CN.min.js", "js");
MiniSite.JsLoader("/static/js/tableExport.min.js", "js");
MiniSite.JsLoader("https://cdn.bootcss.com/bootstrap-table/1.12.1/extensions/export/bootstrap-table-export.min.js", "js");
});
MiniSite.JsLoader("https://cdn.bootcss.com/bootstrap-datepicker/1.8.0/js/bootstrap-datepicker.min.js", "js");
MiniSite.JsLoader("/static/js/common.js", "js");
});
使用js加载器动态加载外部js、css文件的更多相关文章
- JavaScript学习总结(十九)——使用js加载器动态加载外部Javascript文件
今天在网上找到了一个可以动态加载js文件的js加载器,具体代码如下: JsLoader.js 1 var MiniSite=new Object(); 2 /** 3 * 判断浏览器 4 */ 5 M ...
- 使用js加载器动态加载外部Javascript文件
原文:http://www.cnblogs.com/xdp-gacl/p/3927417.html 今天在网上找到了一个可以动态加载js文件的js加载器,具体代码如下: JsLoader.js var ...
- 为不同分辨率单独做样式文件,在页面头部用js判断分辨率后动态加载定义好的样式文件
为不同分辨率单独做样式文件,在页面头部用js判断分辨率后动态加载定义好的样式文件.样式文件命名格式如:forms[_屏幕宽度].css,样式文件中只需重新定义文本框和下拉框的宽度即可. 在包含的头文件 ...
- js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的
js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样 ...
- 动态库DLL加载方式-静态加载和动态加载
静态加载: 如果你有a.dll和a.lib,两个文件都有的话可以用静态加载的方式: message函数的声明你应该知道吧,把它的声明和下面的语句写到一个头文件中 #pragma comment(lib ...
- JAVA反射机制--静态加载与动态加载
Java反射是Java被视为动态(或准动态)语言的一个关键性质.这个机制允许程序在运行时透过Reflection APIs取得任何一个已知名称的class的内部信息,包括其modifiers(诸如pu ...
- [JS前端开发] js/jquery控制页面动态加载数据 滑动滚动条自动加载事件
页面滚动动态加载数据,页面下拉自动加载内容 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样的效果:进入qq空间,向下拉动空 ...
- js与jquery的动态加载脚本文件
jquery动态加载 jQuery.getScript(url,[callback]) js动态加载 function loadJs(name) { document.write('<scrip ...
- js实现滚动条来动态加载数据
主要angular2+es6 data:Array<any> //展示的数据 allData:Array<any> //全部的数据 size:number = 10 //每次动 ...
随机推荐
- 为什么Object.prototype在Function的原型链上与Function.prototype在Object的原型链上都为true
关于javascript的原型链有一个问题我一直很疑惑:为什么 Function instanceof Object 与 Object instanceof Function都为true呢? Func ...
- BZOJ 3672[NOI2014]购票(树链剖分+线段树维护凸包+斜率优化) + BZOJ 2402 陶陶的难题II (树链剖分+线段树维护凸包+分数规划+斜率优化)
前言 刚开始看着两道题感觉头皮发麻,后来看看题解,发现挺好理解,只是代码有点长. BZOJ 3672[NOI2014]购票 中文题面,题意略: BZOJ 3672[NOI2014]购票 设f(i)f( ...
- 题解 [ZJOI2010]基站选址
题解 [ZJOI2010]基站选址 题面 解析 首先考虑一个暴力的DP, 设\(f[i][k]\)表示第\(k\)个基站设在第\(i\)个村庄,且不考虑后面的村庄的最小费用. 那么有\(f[i][k] ...
- P4461 [CQOI2018]九连环
思路:\(DP\) 提交:\(2\)次 错因:高精写挂(窝太菜了) 题解: 观察可知\(f[i]=2*f[i-1]+(n\&1)\) 高精的过程参考了WinXP@luogu的思路: 发现一个问 ...
- Share Point安裝
Win7上裝不了WSS(Sharepoint3.3),而安裝SharePoint Foundation 2010時候又由於不能跑PrerequisiteInstaller.exe,很多該裝的組件裝不上 ...
- windows游戏编程X86 32位保护模式下的内存管理概述(一)
本系列文章由jadeshu编写,转载请注明出处.http://blog.csdn.net/jadeshu/article/details/22445945 作者:jadeshu 邮箱: jades ...
- Java排序之计数排序
Java排序之计数排序 计数排序思路 计数排序适用于有明确范围的数组,比如给定一个数组,且知道所有值得范围是[m,n].这个时候可以使用一个n-m+1长度的数组,待排序的数组就可以散在这个数组上,数组 ...
- ubuntu下安装g++
主要来自ubuntu中文社区http://www.ubuntu.org.cn/support/documentation/doc/VMware 首选,确认你已经安装了build-essential程序 ...
- Flutter移动电商实战 --(28)列表页_商品列表后台接口调试
主要调试商品列表页的接口 这个接口是最难的因为有大类.小类还有上拉加载 先配置接口 config/service_url.dart //const serviceUrl='http://test.ba ...
- 从UDP的”连接性”说起–告知你不为人知的UDP
原文地址:http://bbs.utest.qq.com/?p=631 很早就计划写篇关于UDP的文章,尽管UDP协议远没TCP协议那么庞大.复杂,但是,要想将UDP描述清楚,用好UDP却要比TCP难 ...