JS实现json格式美化

来源：互联网发布：java mq原理图编辑：程序博客网时间：2024/06/01 08:51
 <!DOCTYPE html><html>    <head>        <meta charset="UTF-8">        <title>json格式美化</title>    </head>    <body>        <form id="form1" name="form1">            <textarea name="sourcejson" id="sourcejson" cols="80" rows="30"></textarea>                 <input type="button" onclick="formatJson();" value="美化"/>            <textarea name="targetjson" id="targetjson" cols="80" rows="30">  </textarea>        </form>    </body>      <script type="text/javascript">    function repeat(s, count) {        return new Array(count + 1).join(s);    }    function formatJson() {        var json=  document.form1.sourcejson.value;        var i           = 0,            len          = 0,            tab         = "    ",            targetJson     = "",            indentLevel = 0,            inString    = false,            currentChar = null;        for (i = 0, len = json.length; i < len; i += 1) {             currentChar = json.charAt(i);            switch (currentChar) {            case '{':             case '[':                 if (!inString) {                     targetJson += currentChar + "\n" + repeat(tab, indentLevel + 1);                    indentLevel += 1;                 } else {                     targetJson += currentChar;                 }                break;             case '}':             case ']':                 if (!inString) {                     indentLevel -= 1;                     targetJson += "\n" + repeat(tab, indentLevel) + currentChar;                 } else {                     targetJson += currentChar;                 }                 break;             case ',':                 if (!inString) {                     targetJson += ",\n" + repeat(tab, indentLevel);                 } else {                     targetJson += currentChar;                 }                 break;             case ':':                 if (!inString) {                     targetJson += ": ";                 } else {                     targetJson += currentChar;                 }                 break;             case ' ':            case "\n":            case "\t":                if (inString) {                    targetJson += currentChar;                }                break;            case '"':                 if (i > 0 && json.charAt(i - 1) !== '\\') {                    inString = !inString;                 }                targetJson += currentChar;                 break;            default:                 targetJson += currentChar;                 break;                                }         }         document.form1.targetjson.value=targetJson;        return;    }  </script></html>
注意：不要使用div作为输出容器，因为标签不会被执行。
运行结果
这里写图片描述
0 0