文档章节

简易的js文件加载工具

大朱
 大朱
发布于 2016/06/17 16:17
字数 381
阅读 30
收藏 0

 原理大体就是通过ajax加载指定路径的js文件,在将其加载到内存中

(function(win){
	
	var ajax = function(){
		
		//js获取项目根路径                http://localhost:8080/uploader
		var getRootPath = function(){
		    //获取当前网址               http://localhost:8080/uploader/.....
		    var cur3wPath=window.document.location.href;
		    //获取主机地址之后的目录                    uploader/....
		    var pathName=window.document.location.pathname;
		    var pos=cur3wPath.indexOf(pathName);
		    //获取主机地址                        http://localhost:8080
		    var localhostPaht=cur3wPath.substring(0,pos);
		    //获取带"/"的项目名            /uploader
		    var projectName=pathName.substring(0,pathName.substr(1).indexOf('/')+1);
		    return(localhostPaht+projectName);
		};
		
		//初始化目录
		var URI = getRootPath();
		var initURI = function(uri){
			URI = uri;
		};
		
		//获取XMLHttpRequest 对象
		var _xmlhttp = null;
		var getXMLHttpRequest=function(){
			if(_xmlhttp!=null){
				return _xmlhttp;
			}
			if(win.XMLHttpRequest){
				return new XMLHttpRequest();
			}else{
				return new ActiveXObject("Microsoft.XMLHTTP");
			}
		};
		_xmlhttp = getXMLHttpRequest();
		
		//去除头尾空格
		var _trim = function(data){return null==data?"":(data+"").replace(/(^\s*)|(\s*$)/g,"");};
		//全局对象转换
		var _globalEval = function(data){data&&_trim(data)&&(window.execScript||function(data){window.eval.call(window,data);})(data);};
		
		//ajax请求获取文件内容
		var getText = function(fileName){
			var url=URI+"/"+fileName;
			
			console.log("开始加载"+url);
			
			_xmlhttp.open("GET",url, false);
			_xmlhttp.send();
			if(_xmlhttp.readyState==4 && _xmlhttp.status==200){
				return _xmlhttp.responseText;
			}else if(_xmlhttp.readyState==4){
				throw new Error("加载文件 "+url+" 失败!");
			}
			
			console.log("加载"+url+"成功!");
		};
		
		//将文件内容转换为js对象
		var evalObj = function(text){
			_globalEval(text);//将文件内容转换为js对象
		};
		
		//加载文件
		var load = function(fileName){
			var _text = getText(fileName);
			//对象转换
			evalObj(_text);
		};
		
		//返回自定义ajax对象
		return {
			uri:URI,
			initURI:initURI,
			getText:getText,
			load:load
		};
		
	};
	
	//   "/js/allen.js"
	win.Loader = ajax();
	win.load = win.Loader.load;
	
	console.log("Loader 初始化完毕....");
	
})(window);

可以通过  Loader.load('/js/xxx.js');或者load('/js/xxx.js');

 

 

© 著作权归作者所有

共有 人打赏支持
大朱
粉丝 3
博文 22
码字总数 6690
作品 0
南京
高级程序员
私信 提问
手把手教你撸一个简易的 webpack

背景 随着前端复杂度的不断提升,诞生出很多打包工具,比如最先的,。到后来的和。但是目前很多脚手架工具,比如已经帮我们集成了一些构建工具的使用。有的时候我们可能并不知道其内部的实现...

muwoo
06/07
0
0
原生javascript开发仿微信打飞机小游戏

今天闲来无事,于是就打算教一个初学javascript的女童鞋写点东西,因此为了兼顾趣味性与简易程度,果断想到了微信的打飞机小游戏。。 本来想用html5做的,但是毕竟人家才初学,连jquery都还不...

zaaack
2014/02/04
0
37
67 个节省开发者时间的实用工具、库与资源(前端向)

在这篇文章中,我不会与大家谈论大型的前端框架,如 React、Angular、Vue 等,也没有涉及那些流行的代码编辑器,如 Atom、VS Code、Sublime,我只想与大家分享一个有助于提升开发人员效率的工...

张孝国
06/26
0
0
通过延缓执行 JavaScript 提升网页加载速度

简介 延缓执行 JavaScript 是一个能有效提高网页加载速度以及提升用户阅读体验质量的途径。从实际经验来看,将我们的网站从经济实惠的 VPS 迁移到 Softlayer(美国著名的一个数据中心)独立服...

peterzhu0825
2012/05/23
0
0
15个提高编程技巧的JavaScript工具

JavaScript脚本库是一个预先用JavaScript语言写好的库,它方便了我们开发基于JavaScript的应用程序,特别适合AJAX和其他一些以Web为中心的技术。JavaScript主要用于编写嵌入或者包含在HTML页...

IanSun
2015/03/14
0
0

没有更多内容

加载失败,请刷新页面

加载更多

访问日志不记录静态文件、切割和静态元素过期时间

11月16日任务 11.22 访问日志不记录静态文件 11.23 访问日志切割 11.24 静态元素过期时间 1. 访问日志不记录静态文件 示例一: 网站大多元素为静态文件,如图片、css、js等,这些元素可以不用...

hhpuppy
6分钟前
0
0
day151-2018-11-18-英语流利阅读-待学习

后双十一时代阿里将何去何从? Daniel 2018-11-18 1.今日导读 “这么便宜,我要买下来,统统都要买下来!” 这个双十一,你剁手了吗?据说阿里巴巴天猫在刚过去的双十一里单日销售额再创新高...

飞鱼说编程
13分钟前
1
0
tomcat加内存

Linux下的tomcat: 需要找到catalina.sh,在 cygwin=false 的上面一行加上: 1 JAVA_OPTS="-Xms256m -Xmx512m -Xss1024K -XX:PermSize=128m -XX:MaxPermSize=256m" Windows下解压版的tomcat ......

无知的小孩
24分钟前
0
0
POSIX正则

简介 因为之前对于POSIX类的正则表达式使用的比较少,也就没有上心去记忆,最近因为使用的比较多,就仔细的看了一下做了一个简单的总结。 表达式 \p{Lower} 小写字母字符:[a-z] \p{Upper} 大...

trayvon
59分钟前
1
0
soapui的安装使用

https://blog.csdn.net/weiqing723/article/details/78865734

暗中观察
今天
0
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部