如何使用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 相关文章推荐
在JavaScript中使用inline函数的问题
Mar 08 Javascript
实例分析js和C#中使用正则表达式匹配a标签
Nov 26 Javascript
JavaScript汉诺塔问题解决方法
Apr 21 Javascript
浅析jquery与checkbox的checked属性的问题
Apr 27 Javascript
JavaScript正则表达式exec/g实现多次循环用法示例
Jan 17 Javascript
Bootstrap进度条与AJAX后端数据传递结合使用实例详解
Apr 23 Javascript
jQuery异步提交表单实例
May 30 jQuery
vue.js移动端app实战1:初始配置详解
Jul 24 Javascript
vue计算属性时v-for处理数组时遇到的一个bug问题
Jan 21 Javascript
angular实现页面打印局部功能的思考与方法
Apr 13 Javascript
JS通过位运算实现权限加解密
Aug 14 Javascript
实现elementUI表单的全局验证的方法步骤
Apr 29 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
Apache2 httpd.conf 中文版
2006/12/06 PHP
php preg_match_all结合str_replace替换内容中所有img
2008/10/11 PHP
PHP setcookie指定domain参数后,在IE下设置cookie失效的解决方法
2011/09/09 PHP
PHP静态调用非静态方法的应用分析
2013/05/02 PHP
php获取网卡的MAC地址支持WIN/LINUX系统
2014/04/30 PHP
PHP date()函数警告: It is not safe to rely on the system解决方法
2014/08/20 PHP
PHP排序算法之基数排序(Radix Sort)实例详解
2018/04/21 PHP
一些常用的JS功能函数(2009-06-04更新)
2009/06/04 Javascript
IE6弹出“已终止操作”的解决办法
2010/11/27 Javascript
js将字符串转成正则表达式的实现方法
2013/11/13 Javascript
原生js和jquery中有关透明度设置的相关问题
2014/01/08 Javascript
一个JavaScript防止表单重复提交的实例
2014/10/21 Javascript
JavaScript随机生成信用卡卡号的方法
2015/04/07 Javascript
jQuery移动页面开发中的触摸事件与虚拟鼠标事件简介
2015/12/03 Javascript
Vue获取DOM元素样式和样式更改示例
2017/03/07 Javascript
微信小程序 中wx.chooseAddress(OBJECT)实例详解
2017/03/31 Javascript
Centos6.8下Node.js安装教程
2017/05/12 Javascript
原生javascript AJAX 三级联动的实现代码
2018/05/04 Javascript
Vue实现类似Spring官网图片滑动效果方法
2019/03/01 Javascript
layui 数据表格 点击分页按钮 监听事件的实例
2019/09/02 Javascript
Python多线程编程(五):死锁的形成
2015/04/05 Python
Python用zip函数同时遍历多个迭代器示例详解
2016/11/14 Python
Python2.7基于淘宝接口获取IP地址所在地理位置的方法【测试可用】
2017/06/07 Python
python中format()函数的简单使用教程
2018/03/14 Python
Python批量生成幻影坦克图片实例代码
2019/06/04 Python
Python使用正则表达式分割字符串的实现方法
2019/07/16 Python
Python基于OpenCV实现人脸检测并保存
2019/07/23 Python
Desigual英国官网:在线购买原创服装
2018/03/09 全球购物
欧洲顶级的童装奢侈品购物网站:Bambini Fashion(面向全球)
2018/04/24 全球购物
绢花、人造花和人造花卉:BLOOM
2019/08/07 全球购物
澳大利亚排名第一的露营和户外设备在线零售商:Outbax
2020/05/06 全球购物
党建工作先进材料
2014/05/02 职场文书
干部对照检查材料范文
2014/08/26 职场文书
关于应聘教师的自荐信
2016/01/28 职场文书
python图片灰度化处理的几种方法
2021/06/23 Python
JavaScript与JQuery框架基础入门教程
2021/07/15 Javascript