js格式化json

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>js格式化json</title>
    <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
</head>


<body>
<!--格式化后的json写入的位置-->
<div id="writePlace"></div>
</body>

<!--格式化js-->
<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) {
     
     
        //console.log(node);
        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数据做测试
var originalJson =
  {
     
     "type":"goldOnline","version":"string","time":"string","ip":"string","properties:struct":"serverId:bigint|pluginOnline:array_struct","properties:struct.pluginOnline:array_struct":"pluginId:bigint|appOnline:array_struct","properties:struct.pluginOnline:array_struct.appOnline:array_struct":"appId:bigint|roomOnline:array_struct|total:bigint","properties:struct.pluginOnline:array_struct.appOnline:array_struct.roomOnline:array_struct":"roomId:bigint|online:bigint"}
//(2)调用formatJson函数,将json格式进行格式化
var resultJson = formatJson(originalJson);
//(3)将格式化好后的json写入页面中
document.getElementById("writePlace").innerHTML = '<pre>' +resultJson + '<pre/>';
</script>
</html>
js格式化json

js格式化json

猜你喜欢
