软件开发培训班 >> 编程开发 >> JavaScript

javascript实现的样式表(CSS) 格式整理与压缩

　　本文标签：样式表,格式整理,压缩

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>样式表(CSS) 格式整理与压缩</title> 
<style type="text/css"> 
html,body,form,fieldset,textarea { height:100%; margin:0; padding:0; border:0; font-size:10pt; background:#eee; } 
form { margin:0 1%; overflow:hidden; } 
legend { line-height:3em; font-weight:bolder; } 
button { float:left; margin:1% 1% 0 0; cursor:pointer; } 
textarea { width:100%; height:20em; border:1px solid #ccc; display:block; background:#fff; } 
</style> 
</head> 
<body> 
<form action="" onsubmit="return false"><fieldset> 
<legend>样式表(CSS) 格式整理与压缩</legend> 
<textarea name="" rows="" cols="" id="codeText"> 
body * { font-size:10pt; }/* ss sda */ 
p 
{ clear:left; padding:5px 10px; 
} 
td 
, 
fieldset 
{ padding : 10px ; } 
textarea { 
width:90%; 
height:10em; 
} 
</textarea>

<button type="button" onclick="$(codeText).value=code.A();">压缩代码</button> 
<button type="button" onclick="$(codeText).value=code.B();">格式(多行)</button> 
<button type="button" onclick="$(codeText).value=code.C();">格式(单行)</button> 
<button type="button" onclick="$(codeText).value=code.Z();">还原代码</button> 
</fieldset></form> 
<script type="text/javascript"> 
function $(id){return document.getElementById(id);} 
function codeZip(obj){ 
this.S=function(){ 
var code=obj.value; 
if(!this.codeZ||this.codeZ=="")this.codeZ=code; 
code=code.replace(/(\n|\t|\s)*/ig,$1); 
code=code.replace(/\n|\t|\s(\{|\}|\,|\:|\;)/ig,$1); 
code=code.replace(/(\{|\}|\,|\:|\;)\s/ig,$1); 
return code; 
} 
this.A=function(){ 
var code=this.S(); 
return code; 
} 
this.B=function(){ 
var code=this.S(); 
code=code.replace(/(\{)/ig, $1); 
code=code.replace(/(\{|\;)/ig,$1\n\t); 
code=code.replace(/\t*(\})/ig,$1\n); 
code=code.replace(/(\*\/)/ig,$1\n); 
return code; 
} 
this.C=function(){ 
var code=this.S(); 
code=code.replace(/(\})/ig,$1\n); 
code=code.replace(/(\*\/)/ig,$1\n); 
return code; 
} 
this.Z=function(){ 
return (this.codeZ)?this.codeZ:obj.value; 
} 
var my=this; 
obj.onkeydown=function(){ 
my.codeZ=""; 
} 
} 
var code=new codeZip($(codeText)); 
</script> 
</body> 
</html>

技术文章快速查找

JavaScript内核之基本概念

JQuery中的ready函数冲突的解决方法

javascript中用星号表示预录入内容的实现代码

javascript淘宝评星简版

js css样式操作代码（批量操作）

jquery 实现表单验证功能代码(简洁)

JS限制上传图片大小不使用控件在本地实现

JavaScript入门之语言基础

相关下载

在线教程导航

软件应用
·Windows8	·Windows7	·Word
·Excel	·PPT	·WPS
Web开发
·ASP	·JavaScript	·DIV+CSS
·JSP	·VbScript	·XML
·PHP
开发语言
·VB	·VC	·ASP.NET
·Java	·C++	·Delphi
数据库开发
·MySQL	·MsSQL	·Access
·Oracle	·DB2
手机系统
·Android	·iOS	·WindowsPhone
网站设计
·Flash	·Dreamweaver	·Fireworks
平面设计
·Photoshop	·CorelDraw	·AutoCAD
·3DsMAX	·Illustrator
网络技术
·网站运营	·网络安全	·网络搭建