<html>
    <head>
        <style>    
            textarea{
                width:800px;
                height:250px;
            }
        </style>
        <script>
            function trans(){
                var content = document.getElementById("content");
                //去除注释
                content = removeComment(content.value);
                //去除换行
                content = removeLine(content);
                content = removeSpace(content);    
                //转换成css数组
                var cssList = cssConvert(content);
                for(var i=0;i<cssList.length;i++){
                    alert(cssList[i].attrName + " " +cssList[i].attrValue+ " " +cssList[i].cssNum);
                }
                
                document.getElementById("result").value = content;
            }
            //转换成css数组
            
            function cssConvert(txt){
                var cssList = [];
                var isOpen = false;
                var attrName="";
                var attrValue = "";
                var cssNum = 1;
                for(var i=0;i<txt.length;i++){
                    if(txt[i] == '{') {
                        isOpen = true;
                        continue;
                    }
                    if(txt[i] == '}') {
                        isOpen = false;
                        cssList.push({attrName:attrName,attrValue:attrValue,cssNum:cssNum});
                        cssNum ++;
                        attrValue = "";
                        attrValue = "";
                        continue;
                    }
                    if(isOpen){
                        attrValue += txt[i];
                    } else {
                        attrName += txt[i];
                    }    
                }
                return cssList;
            }
            //去除换行
            function removeLine(txt){
                txt = txt.replace(/<\/?.+?>/g,"");
                txt = txt.replace(/[\r\n]/g, "");
                return txt;
            }
            function removeSpace(txt){
                var isOpen =false;
                for(var i=0;i<txt.length;i++){
                    if(txt[i]=='{'){
                        isOpen = true;
                        if(i-1>=0&&txt[i-1] == ' ') {
                            txt = removeAt(txt,i-1);
                            i--;
                        }
                    }
                    if(txt[i]=='}') isOpen = false;
                    //符合条件的去空格
                    if((i-1>=0&&i+1<txt.length&&txt[i]==' '&&isOpen ==true&&(txt[i-1]==':'||txt[i+1]==':'||txt[i-1]==' '||txt[i+1]==' '||txt[i-1]==';'||txt[i+1]==';'||txt[i-1]=='{'||txt[i-1]=='}'))||(i-1>=0&&txt[i]==' '&&txt[i-1]==' ')||(i-1>=0&&txt[i]==' '&&txt[i-1]=='}')){
                        txt = removeAt(txt,i);
                        i--;
                    } else if(i-1>=0&&i+1<txt.length&&isOpen ==false&&txt[i]==' '&&(txt[i-1]==','||txt[i+1]==','||txt[i-1]==' '||txt[i+1]==' ') ){
                        txt = removeAt(txt,i);
                        i--;
                    }
                }
                return txt;
                //return txt.replace(/\s+/g, "");//.replace(/\s+/g, "");
            }
            function removeAt(txt,i){
                temp = txt.substr(0,i);
                temp += txt.substring(i+1);
                return temp;
            }
            //去除注释
            function removeComment(txt){
                while(true){
                    var start = txt.indexOf("/*");
                    var end = txt.indexOf("*/");
                    var temp = "";
                    if(start >= 0 && end >= 0){
                        temp = txt.substring(0,start);
                        temp += txt.substring(end+2);
                        txt = temp;
                    } else {
                        return txt;
                    }    
                }
            }
        </script>
    </head>
    <body>
        <textarea id="content"></textarea>
        <input type="button" value="转换" onclick="trans()"/>
        <textarea id="result"></textarea>
    </body>
</html>

百度

http://www.ibm.com/developerworks/cn/web/wa-lo-firefox-ext/index.html的更多相关文章

  1. http://www.ibm.com/developerworks/cn/web/wa-aj-jsonp1/index.html

    http://www.ibm.com/developerworks/cn/web/wa-aj-jsonp1/index.html

  2. http://www.ibm.com/developerworks/cn/java/j-lo-junit-src/

    http://www.ibm.com/developerworks/cn/java/j-lo-junit-src/

  3. http://www.ibm.com/developerworks/cn/java/j-lo-hotswapcls/

    http://www.ibm.com/developerworks/cn/java/j-lo-hotswapcls/

  4. http://www.ibm.com/developerworks/cn/opensource/os-cn-cas/

    http://www.ibm.com/developerworks/cn/opensource/os-cn-cas/

  5. Infrastructure as Code 行为驱动开发指南 https://www.ibm.com/developerworks/cn/devops/d-bbd-guide-iac/index.html

    Infrastructure as Code 行为驱动开发指南 https://www.ibm.com/developerworks/cn/devops/d-bbd-guide-iac/index.h ...

  6. 使用 CAS 在 Tomcat 中实现单点登录 http://www.ibm.com/developerworks/cn/opensource/os-cn-cas/

    developerWorks 中国 技术主题 Open source 文档库 使用 CAS 在 Tomcat 中实现单点登录 单点登录(Single Sign On , 简称 SSO )是目前比较流行 ...

  7. Java Content Repository API 简介 转自(https://www.ibm.com/developerworks/cn/java/j-jcr/)

    Java Content Repository API 简介 1 如果曾经试过开发内容管理应用程序,那么您应当非常清楚在实现内容系统时所遇到的固有难题.这个领地有点支离破碎,许多供应商都有自己的私有仓 ...

  8. robotframework安装和配置【转IBM:https://www.ibm.com/developerworks/cn/opensource/os-cn-robot-framework/index.html】

    内容   概览 Robot Framework 介绍 Robot Framework 的安装和配置 RIDE 编辑器介绍 创建测试项目 简单的测试用例的编写 总结 相关主题 评论   Robot Fr ...

  9. CDH5X 安装oozie报错To enable Oozie web console install the Ext JS library.

    最近在CDH5.X 安装oozie 服务,服务安装完毕,访问oozie server ui,报如下错误: 页面提示: Oozie web console is disabled.To enable O ...

随机推荐

  1. bzoj 3073 [Pa2011]Journeys ——线段树优化连边

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=3073 建两棵线段树,一棵孩子向父亲连边,是走出去的:一棵父亲向孩子连边,是走进来的. 注意第 ...

  2. 一般项目转为Maven项目所遇到的问题

    最近搞CI,准备使用Maven,但以前的项目不是Maven项目,需要把项目转换为Maven项目.这遇到几个小问题,一是jar包的依赖,二是从本地仓库取出依赖jar包. 由于没有本地仓库,要手动添加ja ...

  3. WPF ListView VisualPanel

                     <ItemsPanelTemplate x:Key="ItemsPanelTemplate1">                 &l ...

  4. Selenium Webdriver元素定位

    http://www.cnblogs.com/qingchunjun/p/4208159.html

  5. java基础之框架篇(1)

    框架基础反射:反射是Java开发的一类动态相关机制.因为本身Java语言并不是一款动态语言,如果我们想要得到程序动态的效果,因此便引入了反射机制这一概念. 问题:Java中创建实例化对象有哪些方式? ...

  6. JavaScript高级程序设计学习笔记第二十章--JSON

    1.JSON:JavaScript Object Notation, JavaScript 对象表示法. 2.最重要的是要理解它是一种数据格式,不是一种编程语言.虽然具有相同的语法形式,但 JSON ...

  7. mvvm 模板中事件没有执行的解决方案

    今天在wpf设计的过程中,用到了listview,数据绑定在模板中进行,其中有个按钮的click事件,一直不执行,很奇怪,找了很久才找到解决办法,原因还是暂时不清除: <ListView x:N ...

  8. switch()出现警告warning:enumeration value ‘xxx’ not handled in switch

    enumeration value ... not handled in switch 如果在switch中使用使用枚举类型,如:switch(枚举类型) 枚举类型的个数没有全部列出,就会报这个警告

  9. C#连接Oracle数据库解决报错(需要安装Oracle客户端软件8.1.7)的问题

    1.通过nuget安装  ManagedDataAccess 2.引用 using Oracle.ManagedDataAccess.Client; 注:最低framework4.0 测试连接: // ...

  10. MS SQL的CASE...WHEN...THEN...END语法

    根据多个可能的答案检查一个值或变量. 举例说明: SELECT [type],CASE [type] WHEN 'TT' THEN 'TYPE_TABLE' WHEN 'FN' THEN 'SQL_S ...