多个js与css文件的合并方法详细说明


Posted in Javascript onDecember 26, 2012

在Web项目的开发中,js,css文件会随着项目的开发变得越来越多,越来越大,这就给给性能方面带来一些问题,如,页面引入的的js,css越多的话,那么对就增加了http请求数,解决该问题的一个好的方法就是合并js,css文件.
下面就简单介绍一个方法,十分简单.下面介绍以合并js文件为例

(1) G.js文件

~function(){ 
window.G={}; 
G.Method={ 
add:function(){ alert(111);} 
,sub:function(){ alert("减法");} 
}; 
}();

(2) T.js文件
var T=(function(){ 
return { 
t1:function(){alert("t1 method!")} 
,t2:function(){alert("t2方法!")} 
,sum:function(obj){return obj.x+obj.y;} 
}; 
}());

上面列出了连个简单的js文件,下面就要写一个批处理文件来合并以上文件了
(3) 合并js,css文件的批处理方法,文件名假设命名为 debug.bat
copy G.js+T.js GT_bin.js /b

说明:
(1) 输入要合并的js文件,保存debug.bat文件,运行debug.bat即可.
(2) 就这么一行代码就搞定了,十分简单,GT_bin.js 为合并之后的文件名称 , /b是固定参数,文件合并之后,页面就只引用GT_bin.js就可以了,从而减少了js文件的引用,到达了减少http请求的次数,提高了网站的性能.
(3) 合并css文件方法也是如此.
Javascript 相关文章推荐
兼容主流浏览器的iframe自适应高度js脚本
Jan 10 Javascript
[原创]推荐10款最热门jQuery UI框架
Aug 19 Javascript
JavaScript数组前面插入元素的方法
Apr 06 Javascript
jQuery层级选择器实例代码
Feb 06 Javascript
原生js实现旋转木马轮播图效果
Feb 27 Javascript
BootStrap Fileinput插件和Bootstrap table表格插件相结合实现文件上传、预览、提交的导入Excel数据操作步骤
Aug 07 Javascript
Angularjs单选框相关的示例代码
Aug 17 Javascript
利用Node.js批量抓取高清妹子图片实例教程
Aug 02 Javascript
Vue 3.0双向绑定原理的实现方法
Oct 23 Javascript
JavaScript ES6 Class类实现原理详解
May 08 Javascript
40行代码把Vue3的响应式集成进React做状态管理
May 20 Javascript
解决vue自定义组件@click点击失效问题
Apr 30 Vue.js
JS打开图片另存为对话框实现代码
Dec 26 #Javascript
window.addEventListener来解决让一个js事件执行多个函数
Dec 26 #Javascript
js动态添加onload、onresize、onscroll事件(另类方法)
Dec 26 #Javascript
JSON为什么那样红为什么要用json(另有洞天)
Dec 26 #Javascript
JS操作Cookies包括(读取添加与删除)
Dec 26 #Javascript
js 调用本地exe的例子(支持IE内核的浏览器)
Dec 26 #Javascript
js鼠标滑过弹出层的定位IE6bug解决办法
Dec 26 #Javascript
You might like
php下检测字符串是否是utf8编码的代码
2008/06/28 PHP
PHP学习 变量使用总结
2011/03/24 PHP
php导出word格式数据的代码实例
2013/11/25 PHP
解读PHP中的垃圾回收机制
2015/08/10 PHP
ThinkPHP项目分组配置方法分析
2016/03/23 PHP
PHP7 字符串处理机制修改
2021/03/09 PHP
firefox下frameset取不到值的解决方法
2010/09/06 Javascript
jquery获取特定name所有选中的checkbox,支持IE9标准模式
2013/03/18 Javascript
关于jQuery判断元素是否存在的问题示例探讨
2014/07/21 Javascript
JQuery复制DOM节点的方法
2015/06/11 Javascript
图解JavaScript中的this关键字
2020/05/28 Javascript
ES6使用let命令更简单的实现块级作用域实例分析
2017/03/31 Javascript
JavaScript中三个等号和两个等号你了解多少
2017/07/04 Javascript
js实现单张图片平移切换效果
2017/10/11 Javascript
微信小程序实现通过js操作wxml的wxss属性示例
2018/12/06 Javascript
Vue3.0中的monorepo管理模式的实现
2019/10/14 Javascript
uni-app如何实现增量更新功能
2020/01/03 Javascript
uni-app使用微信小程序云函数的步骤示例
2020/05/22 Javascript
javascript canvas时钟模拟器
2020/07/13 Javascript
[01:14]英雄,所敬略同——2018完美盛典宣传视频
2018/12/05 DOTA
举例详解Python中yield生成器的用法
2015/08/05 Python
详解python 发送邮件实例代码
2016/12/22 Python
如何用itertools解决无序排列组合的问题
2017/05/18 Python
浅谈Python实现2种文件复制的方法
2018/01/19 Python
使用python根据端口号关闭进程的方法
2018/11/06 Python
对python打乱数据集中X,y标签对的方法详解
2018/12/14 Python
python 设置输出图像的像素大小方法
2019/07/04 Python
pytorch AvgPool2d函数使用详解
2020/01/03 Python
Python自动化测试基础必备知识点总结
2021/02/07 Python
《天安门广场》教学反思
2014/04/23 职场文书
中国梦团日活动总结
2014/07/07 职场文书
大专应届毕业生求职信
2014/07/15 职场文书
2014年企业员工工作总结
2014/12/09 职场文书
护士业务学习心得体会
2016/01/25 职场文书
Python中的min及返回最小值索引的操作
2021/05/10 Python
Python中的np.argmin()和np.argmax()函数用法
2021/06/02 Python