<!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>
