xml+css+sql+json+html+js格式化,JavaScript格式化json和xml的方法示例

本文实例讲述了JavaScript格式化json和xml的方法。分享给大家供大家参考，具体如下：

格式化json实例

原生js格式化json的方法

//格式化代码函数,已经用原生方式写好了不需要改动,直接引用就好

var formatJson = function (json, options) {

var reg = null,

formatted = '',

pad = 0,

PADDING = ' ';

options = options || {};

options.newlineAfterColonIfBeforeBraceOrBracket = (options.newlineAfterColonIfBeforeBraceOrBracket === true) ? true : false;

options.spaceAfterColon = (options.spaceAfterColon === false) ? false : true;

if (typeof json !== 'string') {

json = JSON.stringify(json);

} else {

json = JSON.parse(json);

json = JSON.stringify(json);

}

reg = /([\{\}])/g;

json = json.replace(reg, '\r\n$1\r\n');

reg = /([\[\]])/g;

json = json.replace(reg, '\r\n$1\r\n');

reg = /(\,)/g;

json = json.replace(reg, '$1\r\n');

reg = /(\r\n\r\n)/g;

json = json.replace(reg, '\r\n');

reg = /\r\n\,/g;

json = json.replace(reg, ',');

if (!options.newlineAfterColonIfBeforeBraceOrBracket) {

reg = /\:\r\n\{/g;

json = json.replace(reg, ':{');

reg = /\:\r\n\[/g;

json = json.replace(reg, ':[');

}

if (options.spaceAfterColon) {

reg = /\:/g;

json = json.replace(reg, ':');

}

(json.split('\r\n')).forEach(function (node, index) {

var i = 0,

indent = 0,

padding = '';

if (node.match(/\{$/) || node.match(/\[$/)) {

indent = 1;

} else if (node.match(/\}/) || node.match(/\]/)) {

if (pad !== 0) {

pad -= 1;

}

} else {

indent = 0;

}

for (i = 0; i < pad; i++) {

padding += PADDING;

}

formatted += padding + node + '\r\n';

pad += indent;

}

);

return formatted;

};

//引用示例部分

//(1)创建json格式或者从后台拿到对应的json格式

var originalJson = {"name": "binginsist", "sex": "男", "age": "25"};

//(2)调用formatJson函数,将json格式进行格式化

var resultJson = formatJson(originalJson);

//(3)将格式化好后的json写入页面中

document.getElementById("writePlace").innerHTML = '

' +resultJson + '

';

这里使用在线HTML/CSS/JavaScript代码运行工具：http://tools.jb51.net/code/HtmlJsRun测试上述代码，可得如下运行结果：

{

"name":"binginsist",

"sex":"男",

"age":"25"

}

格式化xml实例

在格式化XML时后台需要对返回数据做一下处理：

StringEscapeUtils.escapeHtml(po.getMsgBody())

原生js格式化xml的方法

//格式化代码函数,已经用原生方式写好了不需要改动,直接引用就好

String.prototype.removeLineEnd = function () {

return this.replace(/(<.>

}

function formatXml(text) {

//去掉多余的空格

text = '\n' + text.replace(/()/g, function ($0, name, props) {

return name + ' ' + props.replace(/\s+(\w+=)/g, " $1");

}).replace(/>\s*?\n

//把注释编码

text = text.replace(/\n/g, '\r').replace(//g, function ($0, text) {

var ret = '';

//alert(ret);

return ret;

}).replace(/\r/g, '\n');

//调整格式

var rgx = /\n(|\s*?(\/)>)(?:.*?(?:(?:(\/)>)|(?:)))?)/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 + '';

//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('');

}

//引用示例部分

//(1)创建xml格式或者从后台拿到对应的xml格式

var originalXml = '<?xml version="1.0"?> ToveJaniReminder Dont forget me this weekend! ';

//(2)调用formatXml函数,将xml格式进行格式化

var resultXml = formatXml(originalXml);

//(3)将格式化好后的formatXml写入页面中

document.getElementById("writePlace").innerHTML = '

' +resultXml + '

';

这里使用在线HTML/CSS/JavaScript代码运行工具：http://tools.jb51.net/code/HtmlJsRun测试上述代码，可得如下运行结果：

Tove

Jani

Reminder

Dont forget me this weekend!

PS：这里再为大家提供几款关于xml与json操作的在线工具供大家参考使用：

希望本文所述对大家JavaScript程序设计有所帮助。