如何使用Javascript正则表达式来格式化XML内容


Posted in Javascript onJuly 04, 2013

使用得是Emeditor ,在看XML文档时,总是因为格式混乱而看不清。这个是一个Emeditor宏来自动格式化XML。下载:formatXml.rar (1,021.00 bytes)
下面这段是这个网页版的javascript格式化XML的代码。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
    <meta http-equiv=content-type content="text/html; charset=UTF-8">
    <title>Xml格式化工具</title>
    <script type="text/javascript">
    String.prototype.removeLineEnd = function()
    {
        return this.replace(/(<.+?\s+?)(?:\n\s*?(.+?=".*?"))/g,'$1 $2')
    }
    function formatXml(text)
    {
        //去掉多余的空格
        text = '\n' + text.replace(/(<\w+)(\s.*?>)/g,function($0, name, props)
        {
            return name + ' ' + props.replace(/\s+(\w+=)/g," $1");
        }).replace(/>\s*?</g,">\n<");        //把注释编码
        text = text.replace(/\n/g,'\r').replace(/<!--(.+?)-->/g,function($0, text)
        {
            var ret = '<!--' + escape(text) + '-->';
            //alert(ret);
            return ret;
        }).replace(/\r/g,'\n');
        //调整格式
        var rgx = /\n(<(([^\?]).+?)(?:\s|\s*?>|\s*?(\/)>)(?:.*?(?:(?:(\/)>)|(?:<(\/)\2>)))?)/mg;
        var nodeStack = [];
        var output = text.replace(rgx,function($0,all,name,isBegin,isCloseFull1,isCloseFull2 ,isFull1,isFull2){
            var isClosed = (isCloseFull1 == '/') || (isCloseFull2 == '/' ) || (isFull1 == '/') || (isFull2 == '/');
            //alert([all,isClosed].join('='));
            var prefix = '';
            if(isBegin == '!')
            {
                prefix = getPrefix(nodeStack.length);
            }
            else 
            {
                if(isBegin != '/')
                {
                    prefix = getPrefix(nodeStack.length);
                    if(!isClosed)
                    {
                        nodeStack.push(name);
                    }
                }
                else
                {
                    nodeStack.pop();
                    prefix = getPrefix(nodeStack.length);
                }
            }
                var ret =  '\n' + prefix + all;
                return ret;
        });
        var prefixSpace = -1;
        var outputText = output.substring(1);
        //alert(outputText);
        //把注释还原并解码,调格式
        outputText = outputText.replace(/\n/g,'\r').replace(/(\s*)<!--(.+?)-->/g,function($0, prefix,  text)
        {
            //alert(['[',prefix,']=',prefix.length].join(''));
            if(prefix.charAt(0) == '\r')
                prefix = prefix.substring(1);
            text = unescape(text).replace(/\r/g,'\n');
            var ret = '\n' + prefix + '<!--' + text.replace(/^\s*/mg, prefix ) + '-->';
            //alert(ret);
            return ret;
        });
        return outputText.replace(/\s+$/g,'').replace(/\r/g,'\r\n');
    }
    function getPrefix(prefixIndex)
    {
        var span = '    ';
        var output = [];
        for(var i = 0 ; i < prefixIndex; ++i)
        {
            output.push(span);
        }
        return output.join('');
    }        
        function btnFormat_click()
        {
            var $ = document.getElementById;
            $('output').value = formatXml($('input').value);
        }
    </script>
    
</head>
<body>
    <textarea id="input" style="width:100%;height:45%;"></textarea>
    <div style="margin:0px auto;"><input type="button" id="btnFormat" onclick="btnFormat_click()" value="格式化" style="width:50%;height:10%;"/></div>
    <textarea id="output" style="width:100%;height:45%;"></textarea>
</body>
</html>
Javascript 相关文章推荐
一个可绑定数据源的jQuery数据表格插件
Jul 17 Javascript
解析jquery中的ajax缓存问题
Dec 19 Javascript
javascript:void(0)的问题使用探讨
Apr 10 Javascript
HTML5实现留言和回复页面样式
Jul 22 Javascript
使用JavaScript判断手机浏览器是横屏还是竖屏问题
Aug 02 Javascript
BootStrap 实现各种样式的进度条效果
Dec 07 Javascript
JavaScript用二分法查找数据的实例代码
Jun 17 Javascript
vue2.0项目中使用Ueditor富文本编辑器示例代码
Aug 14 Javascript
基于angular6.0实现的一个组件懒加载功能示例
Apr 12 Javascript
JS将网址url转化为JSON格式的方法
Jul 02 Javascript
微信小程序语音同步智能识别的实现案例代码解析
May 29 Javascript
js实现购物车商品数量加减
Sep 21 Javascript
解析Jquery取得iframe中元素的几种方法
Jul 04 #Javascript
jQuery动态设置form表单的enctype值(实现代码)
Jul 04 #Javascript
浅析jQuery中常用的元素查找方法总结
Jul 04 #Javascript
浅析jQuery对select操作小结(遍历option,操作option)
Jul 04 #Javascript
解析jQuery与其它js(Prototype)库兼容共存
Jul 04 #Javascript
JQuery-tableDnD 拖拽的基本使用介绍
Jul 04 #Javascript
JQuery.Ajax之错误调试帮助信息介绍
Jul 04 #Javascript
You might like
php 数组的创建、调用和更新实现代码
2009/03/09 PHP
php+mysqli预处理技术实现添加、修改及删除多条数据的方法
2015/01/30 PHP
PHP curl批处理及多请求并发实现方法分析
2018/08/15 PHP
JavaScript中一个奇葩的IE浏览器判断方法
2014/04/16 Javascript
JavaScript中匿名、命名函数的性能测试
2014/09/04 Javascript
jQuery实现的淡入淡出二级菜单效果代码
2015/09/15 Javascript
javascript实现很浪漫的气泡冒出特效
2020/09/05 Javascript
jquery获取form表单input元素值的简单实例
2016/05/30 Javascript
jQuery实现的tab标签切换效果示例
2016/09/05 Javascript
bootstrap paginator分页前后台用法示例
2017/06/17 Javascript
JS去掉字符串末尾的标点符号及删除最后一个字符的方法
2017/10/24 Javascript
vue父组件向子组件传递多个数据的实例
2018/03/01 Javascript
webpack+vue-cli项目中引入外部非模块格式js的方法
2018/09/28 Javascript
浅谈ng-zorro使用心得
2018/12/03 Javascript
js设计模式之单例模式原理与用法详解
2019/08/15 Javascript
小程序使用watch监听数据变化的方法详解
2019/09/20 Javascript
vue中的mescroll搜索运用及各种填坑处理
2019/10/30 Javascript
微信小程序实现多选框全选与反全选及购物车中删除选中的商品功能
2019/12/17 Javascript
JavaScript常用工具函数大全
2020/05/06 Javascript
python通过imaplib模块读取gmail里邮件的方法
2015/05/08 Python
python函数装饰器用法实例详解
2015/06/04 Python
一个基于flask的web应用诞生(1)
2017/04/11 Python
用Python在Excel里画出蒙娜丽莎的方法示例
2020/04/28 Python
聊聊python中的异常嵌套
2020/09/01 Python
英国最大的宠物食品和宠物用品网上零售商: Zooplus
2016/08/01 全球购物
英国老牌潮鞋店:Offspring
2019/08/19 全球购物
美国在线医疗分销商:MedEx Supply
2020/02/04 全球购物
Optimalprint加拿大:在线打印服务
2020/04/03 全球购物
如果重写了对象的equals()方法,需要考虑什么
2014/11/02 面试题
水利公司纪检监察自我鉴定
2014/02/25 职场文书
协议书的格式
2014/04/23 职场文书
2014年协会工作总结
2014/11/22 职场文书
岗位职责范本大全
2015/02/26 职场文书
信访维稳承诺书
2015/05/04 职场文书
运动会加油稿30字
2015/07/21 职场文书
python开发飞机大战游戏
2021/07/15 Python