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

更新时间：2010年05月13日 18:55:25 作者：

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>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

您可能感兴趣的文章:

EXT中单击button按钮grid添加一行（光标位置可设置)的实例代码
这篇文章主要介绍了EXT中单击button按钮grid添加一行（光标位置可设置)的实例代码的相关资料,需要的朋友可以参考下
2016-06-06
JavaScript实现缓动动画
这篇文章主要为大家详细介绍了JavaScript实现缓动动画，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2020-11-11
JavaScript导出Excel实例详解
这篇文章主要介绍了JavaScript导出Excel的方法,以实例形式详细分析了javascript将WEB页面导出为EXCEL文档的方法及相关的技巧说明,对于深入了解javascript编程原理有一定的借鉴价值,需要的朋友可以参考下
2014-11-11
js如何获取兄弟、父类等节点
本文为大家介绍下js获取兄弟、父类等节点的方法，感兴趣的朋友可以参考下
2014-01-01
详解JavaScript堆栈与拷贝
本文主要介绍了JavaScript中的堆栈与拷贝，能更好的帮助你理解JS的内存机制，感兴趣的同学，一定要认真看下
2021-06-06
可以用来调试JavaScript错误的解决方案
我们在书写js的过程中，经常会出现一些js错误，对于如果找出错误的解决方法就是关键，下面的文章就是相关的调试方法。
2010-08-08
JavaScript 装饰器模式用法详解
装饰器模式（Decorator Pattern）是一种结构型设计模式，它允许动态地向一个对象添加新的行为，本文将带大家详细了解一下JavaScript装饰器模式，文中有相关的示例代码供大家参考，感兴趣的同学可以跟着小编一起学习
2023-05-05
Uniapp中使用Echarts的详细过程
这篇文章主要介绍了Uniapp中使用Echarts的示例详解这里只举例折线图，介绍了uni-app微信小程序使用echarts的方法,下载echart组件，可以先随便建个文件夹，然后 npm init，接着下载依赖，需要的朋友可以参考下
2022-11-11
经验几则推荐
[红色]经验几则推荐...
2006-09-09
JS获取DropDownList的value值与text值的示例代码
本篇文章主要是对JS获取DropDownList的value值与text值的示例代码进行了介绍，需要的朋友可以过来参考下，希望对大家有所帮助
2014-01-01

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

相关文章

最新评论

大家感兴趣的内容

最近更新的内容

常用在线小工具