您好,登录后才能下订单哦!
密码登录
登录注册
点击 登录注册 即表示同意《亿速云用户服务条款》
今天就跟大家聊聊有关怎么在JavaScript中对json和xml进行格式化,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。
格式化json实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>原生js格式化json的方法</title> </head> <body> <!--格式化后的json写入的位置--> <div id="writePlace"></div> <script> //格式化代码函数,已经用原生方式写好了不需要改动,直接引用就好 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 = '<pre>' +resultJson + '<pre/>'; </script> </body> </html>
这里使用在线HTML/CSS/JavaScript代码运行工具:http://tools.jb51.net/code/HtmlJsRun测试上述代码,可得如下运行结果:
{
"name":"binginsist",
"sex":"男",
"age":"25"
}
格式化xml实例
在格式化XML时后台需要对返回数据做一下处理:
StringEscapeUtils.escapeHtml(po.getMsgBody())
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>原生js格式化xml的方法</title> </head> <body> <!--格式化后的xml写入的位置--> <div id="writePlace"></div> <script> //格式化代码函数,已经用原生方式写好了不需要改动,直接引用就好 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(''); } //引用示例部分 //(1)创建xml格式或者从后台拿到对应的xml格式 var originalXml = '<?xml version="1.0"?> <note> <to>Tove</to> <from>Jani</from> <heading>Reminder</heading> <body>Dont forget me this weekend!</body> </note>'; //(2)调用formatXml函数,将xml格式进行格式化 var resultXml = formatXml(originalXml); //(3)将格式化好后的formatXml写入页面中 document.getElementById("writePlace").innerHTML = '<pre>' +resultXml + '<pre/>'; </script> </body> </html>
运行结果:
Tove
Jani
Reminder
Dont forget me this weekend!
看完上述内容,你们对怎么在JavaScript中对json和xml进行格式化有进一步的了解吗?如果还想了解更多知识或者相关内容,请关注亿速云行业资讯频道,感谢大家的支持。
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。