Question

我的服务器端将返回一个JSON字符串，我需要在我的Html页面上显示它。所以我们可以说字符串是这样的：

{"FirstChildType":{"FirstGrandChild":{"GrandChildName":"123"},"FirstChildName":"a"},"SecondChildType":{"SecondChildName":"SecondChildABC","SecondChildLastName":"SecondChildXYZ"},"ThirdChildType":null,"FirstName":"ABC","LastName":"XYZ"}

如何在我的Html中以一个很好的缩进显示这个？我试过'google-code-prettify'，但不知道怎么办不能像我想的那样工作。

Answer 1

您可以使用JSON.stringify对其进行格式化：

var jsParsed = {"FirstChildType":{"FirstGrandChild":{"GrandChildName":"123"},"FirstChildName":"a"},"SecondChildType":{"SecondChildName":"SecondChildABC","SecondChildLastName":"SecondChildXYZ"},"ThirdChildType":null,"FirstName":"ABC","LastName":"XYZ"};        
var indented = JSON.stringify(g,null,4);

Answer 2

此页面可以很好地回答JSON.stringfy。在JS Fiddle

中查看

            function syntaxHighlight(json) {
                if (typeof json != 'string') {
                     json = JSON.stringify(json, undefined, 2);
                }
                json = json.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
                return json.replace(/("(\\u[a-zA-Z0-9]{4}|\\[^u]|[^\\"])*"(\s*:)?|\b(true|false|null)\b|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?)/g, function (match) {
                    var cls = 'number';
                    if (/^"/.test(match)) {
                        if (/:$/.test(match)) {
                            cls = 'key';
                        } else {
                            cls = 'string';
                        }
                    } else if (/true|false/.test(match)) {
                        cls = 'boolean';
                    } else if (/null/.test(match)) {
                        cls = 'null';
                    }
                    return '<span class="' + cls + '">' + match + '</span>';
                });
            }

在html中显示Json String并使用正确的缩进

2 个答案: