<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. Hadoop安装全教程 Ubuntu14.04+Java1.8.0+Hadoop2.7.6

    最近听了一个关于大数据的大牛的经验分享,在分享的最后大牛给我们一个他之前写好的关于大数据和地理应用demo.这个demo需要在Linux环境上搭建Hadoop平台.这次就简单的分享一下我关于在 Lin ...

  2. java注解总结(1)

    1.什么是注解 注解,主要提供一种机制,这种机制允许程序员在编写代码的同时可以直接编写元数据. 2.介绍 何为注解?--->元数据:描述数据自身的数据. 注解就是代码的元数据,他们包含了代码自身 ...

  3. Silverlight 5 系列学习之一

    最近公司要用Silverlight 开发并且使用了5 ,以前只学过WPF 没看过Silverlight ,不过在争光中国看了看其概念原来如此.它只不过是轻量级的WPF,且目标在于跨浏览器及平台.费话少 ...

  4. Robot Framework基础学习(六)

    网页弹窗 参考:http://blog.csdn.net/Allan_shore_ma/article/details/65629246 常见的网页弹窗,有如下几类: alert ajax ifram ...

  5. 关于SetTimer间隔小于OmTimer执行时间的问题

    如果SetTimer的时间间隔为t,其响应事件OnTimer代码执行一遍的时间为T,且T>t.这样,一次未执行完毕,下一次定时到,这时候程序会如何执行? 可能的情况:1.丢弃还未执行的代码,开始 ...

  6. 利用JS函数制作时钟运行程序

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. poj2449(k短路&A_star模板)

    题目链接:http://poj.org/problem?id=2449 题意:给出一个有向图,求s到t的第k短路: 思路:k短路模板题,可以用A_star模板过: 单源点最短路径+高级搜索A*;A*算 ...

  8. 洛谷P1368 均分纸牌(加强版)

    P1368 均分纸牌(加强版) 题目描述 有 N 堆纸牌,编号分别为 1,2,…, N.每堆上有若干张,纸牌总数必为 N 的倍数.可以在任一堆上取1张纸牌,然后移动. 移牌规则为:在编号为 1 堆上取 ...

  9. Vue2中实现微信分享支付功能

    Vue2中实现微信分享支付功能  近期做了一个微信公众号前后分离项目,前端采用Vue2开发,后端SpringBoot,今天迫不及待的来给大家分享一下这次在开发中遇到的一些坑以及解决办法. 在这里,一些 ...

  10. python 之 time模块、datetime模块(打印进度条)

    6.9 time 模块 方法 含义 备注 time.time() 时间戳 1561013092.997079 time.strftime('%Y-%m-%d %H:%M:%S %p') 结构化时间st ...