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需再刷新一下页面才能执行]

您可能感兴趣的文章:

全面解析Bootstrap中scrollspy（滚动监听）的使用方法
这篇文章主要为大家全面解析Bootstrap中scrollspy（滚动侦听）的使用方法，感兴趣的小伙伴们可以参考一下
2016-06-06
js动态添加onload、onresize、onscroll事件(另类方法)
window 的 onload、onresize、onscroll 事件，跟其他的事件不一样，它不能用 attachEvent 或 addEventListener 来添加于是本人想了一些另类的方法，需要了解的朋友可以参考下
2012-12-12
javascript实现的简单计时器
计时器提供了一个可以将代码片段异步延时执行的能力，javascript生来是单线程的（在一定时间范围内仅一部分js代码能运行），计时器为我们提供了一种避开这种限制的方法，从而开辟了另一条执行代码的蹊径。
2015-07-07
详解微信JS-SDK选择图片遇到的坑
这篇文章主要介绍了详解微信JS-SDK选择图片遇到的坑，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2018-08-08
什么是JavaScript注入攻击?
本文告诉大家什么是js注入，讨论防止 ASP.NET MVC 应用程序受到 JavaScript 注入攻击的两种技术，感兴趣的小伙伴们可以参考一下
2016-09-09
微信小程序获取手机号 JavaScript解密示例代码详解
这篇文章主要介绍了微信小程序获取手机号 JavaScript解密的示例代码，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
2020-05-05
微信小程序自定义组件
这篇文章主要为大家详细介绍了微信小程序自定义组件的相关资料，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2017-08-08
CSS也可以把IE6弄死
2008-04-04
基于javascript实现动态时钟效果
这篇文章主要为大家详细介绍了基于javascript实现动态时钟效果的相关资料，动态显示系统当前时间，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2016-02-02
codeMirror插件使用讲解
codeMirror是一款十分强大的代码编辑插件，提供了十分丰富的API，最近在项目中用到了这款插件，于是在这里给大家分享下使用方法和心得。具有一定的参考价值，下面跟着小编一起来看下吧
2017-01-01