PHP小技巧之JS和CSS优化工具Minify的使用方法

2024-10-17 10:07:07

一、实现合并和压缩多个JS和CSS文件的代码

HTML：

代码如下:

PHP：

代码如下:

//输出JS
header ("Content-type:Application/x-javascript; Charset: utf-8");
if(isset($_GET)) {
$files = explode(",", $_GET['get']);
$str = '';
foreach ($files as $key => $val){
$str .= file_get_contents($_GET['path'].$val);
}

$str = str_replace("\t", "", $str); //清除空格
$str = str_replace("\r\n", "", $str);
$str = str_replace("\n", "", $str);

// 删除单行注释
$str = preg_replace("/\/\/\s*[a-zA-Z0-9_\x7f-\xff][a-zA-Z0-9_\x7f-\xff]*/", "", $str);
// 删除多行注释
$str = preg_replace("/\/\*[^\/]*\*\//s", "", $str);

echo $str;
}

//输出CSS
header ("content-type:text/css; charset: utf-8");
if(isset($_GET)) {
$files = explode(",", $_GET['get']);
$fc = '';
foreach ($files as $key => $val){
$fc .= file_get_contents($_GET['path'].$val.".css");
}
$fc = str_replace("\t", "", $fc); //清除空格
$fc = str_replace("\r\n", "", $fc);
$fc = str_replace("\n", "", $fc);
$fc = preg_replace("/\/\*[^\/]*\*\//s", "", $fc);
echo $fc;
}

只是个简单原型，没有封装。另外，合并后的文件记得配合缓存

二、Minify的使用方法

1、从code.google.com/p/minify/下载最新版Minify并解压缩，将"min"文件夹连同里面的内容一起复制到DOCUMENT_ROOT目录下（即网站跟目录）。

可以修改文件夹名"min"

2、在"min/groupsConfig.php"里配置g参数

代码如下:

return array(
// 'js' => array('//js/file1.js', '//js/file2.js'),
// 'css' => array('//css/file1.css', '//css/file2.css'),
);

3、在网页中按照如下方式引用就可以了：

后面的数字可以用更新日期来作标志，"min"和步骤1里的名称对应。

4、性能优化，请参考code.google.com/p/minify/wiki/CookBook

注意：

1、需要将httpd.conf里的rewrite_module模块开启

2、开发过程中，可以将调试模式开启，开发完毕后再将调试模式关闭，可以利用火狐浏览器的firebug来查看

代码如下:

$min_allowDebugFlag = true

Angular工具方法学习

angular为我们提供了很多的工具方法. angular.bind 更改this指向 var obj1 = { name : 'obj1', show : function(str){ return this.name + str; } }; var obj2 = { name : 'obj2' }; var a = angular.bind(obj2,obj1.show,' is a object'); var b = angular.bind(obj2,obj1.show,[' is a
常用Extjs工具:Extjs.util.Format使用方法

抄些常用工具方便查找 ----------字符串 Ext.util.Format.capitalize(string str);//将首字母变大写 Ext.util.Format.ellipsis(string value, Number length);//截取指定length字符,将自动在尾处添加省略号'...' Ext.util.Format.htmlEncode(string value); //将文本编码 lowercase(string value);//变小写 stripScrip
一款js和css代码压缩工具[附JAVA环境配置方法]

TBCompressor的安装很简单,点击install.cmd就可以了,安装后会在里的右键菜单里出现"Compress CSS or JS"选项,需要压缩文件时只需选取目标文件然后右键点选"Compress CSS or JS"即刻.压缩后的文件会自动重命名. 这里对jQuery1.3 Development版进行压缩测试,效果如下:可以看到效果还是非常不错的:) TBCompressor下载需要注意的是使用TBCompressor必须要有JAVA环境的支持,需
解决http://16a.us/2.js之arp欺骗的方法附专杀工具

公司局域网访问所有页面都加上了<script src=http://16a.us/2.js></script>代码, 这次是客户端打开的所有网页,故可排除是服务器环境遭遇arp欺骗,综合网上各方意见,得出结论:本地网关或dns被劫持,修复本地连接后故障消除. 根本解决方法,绑定网关mac地址,方法为: 命令行输入arp -s 网关IP 网关MAC 关于网关MAC,可使用arp命令查询. 如果是dns被劫持,则更改dns服务器. 关于js加密解密的两篇文章,想研究上面病毒脚本的朋友可
js工具方法弹出蒙版

复制代码代码如下: //工具方法弹出蒙版 add by dning 2012-11-4var maskShow = (function () { var mask = null; var curr = null; var free = false; var func = { onresize: null, onscroll: null }; return function (el, fre, Type) { if (
JavaScript1.6数组新特性介绍以及JQuery的几个工具方法

JavaScript 1.6 引入了几个新的Array 方法,具体的介绍见:New in JavaScript 1.6 .这些方法已经被写进了ECMA262 V5.现代浏览器(IE9/Firefox/Safari/Chrome/Opera)都已经支持,但IE6/7/8不支持.jquery的工具方法中提供了类似的功能. 1.Array.forEach()和jquery的$().each().在数组中的每个项上运行一个函数.类似java5 增强的for循环. 复制代码代码如下: var ary =
将nodejs打包工具整合到鼠标右键的方法

打包用到的批处理文件代码如下: 复制代码代码如下: @echo offtitle Builder - 正在合并 ... color 03REM =====================================REM jsbuilder beta版REMREM =====================================SETLOCAL ENABLEEXTENSIONS echo. REM 过滤文件后缀,只combo js文件if "%~x1" NEQ
js调试工具console.log()方法查看js代码的执行情况

我之前在调试代码的时候,跟砸js代码执行情况,一般都是通过在代码块中使用alert的方式查看js代码的执行情况,今天也是看到有朋友使用console.log函数打印输出函数,变量,对象,下边就console.log的使用情况进行记录,具体的语法是: console.log("值为:",fn); console.log()能够输出变量,函数,数组,对象等等 <html> <head> <title>this关键字_函数调用</title>
node.js版本管理工具n无效的原理和解决方法

简介 n 是 node 的一个模块,可以用它来管理 node 的各种版本.类似 Python 中的 pyenv 和 Ruby 的 rbenv.n 的作者是著名的TJ大神. 通过 npm 安装 n: $ npm install -g n 查看当前 node 版本: $ node -v v4.2.4 通过 n 安装指定版本: $ n 4.4.4 install : node-v4.4.4 mkdir : /opt/node/n/versions/node/4.4.4 fetch : https://
js实现带关闭按钮始终显示在网页最底部工具条的方法

本文实例讲述了js实现带关闭按钮始终显示在网页最底部工具条的方法.分享给大家供大家参考.具体如下: 这是一款很实用的代码,给网页加入一个始终显示在浏览器窗口底部的工具栏,可以在上面放上公告,联系人等等信息,此代码的工具条还带有关闭按钮,可以随时关闭复制代码代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml

PHP小技巧之JS和CSS优化工具Minify的使用方法

相关推荐

随机推荐