Prettify Generated JSON

Я пытаюсь вывести некоторый форматированный JSON, который я генерирую, но он, похоже, не работает. Я бы хотел, чтобы каждый объект JSON был набран на вкладке и правильно размещен, чтобы быть очень читаемым. Что я здесь делаю неправильно?Prettify Generated JSON

var arr = new Array(20).fill().map(function() { 
    var first = chance["first"]({gender: "male"}); 
    var last = chance["last"](); 
    var company = "DinnerCall"; 
    var city = chance["city"](); 
    var state = chance["state"](); 
    var address = chance["address"](); 

    return { 
    first: first, 
    last: last, 
    email: first.toLowerCase() + "." + last.toLowerCase() + "@" + company.toLowerCase() + ".com", 
    company: company, 
    address: address, 
    state: chance["state"](), 
    }; 
}); 

var jsonPretty = JSON.stringify({users: arr}, null, '\t'); 
$("body").text(jsonPretty);

https://jsfiddle.net/La5qstdd/5/

источник

2016-07-20 Jon

Браузеры по умолчанию выделяют пробелы в HTML.

Использование тега <pre> может помочь.

Вместо того, чтобы вставлять текст в <body>, попробуйте изменить свой html, чтобы иметь тег <pre> или раздел «предварительно отформатированный текст».

var json = { 
 
    a: 'Hello', 
 
    b: 'World', 
 
    c: { 
 
    d: 'Hello', 
 
    e: 'World' 
 
    } 
 
}; 
 

 
var jsonPretty = JSON.stringify(json, null, 2); 
 
$(".json-content") 
 
    .text(jsonPretty);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<body> 
 
    <pre class="json-content"> 
 
    </pre> 
 
</body>

источник

2016-07-20 17:08:03

Ааа, не понимают, что они избежали пространства. Конечно. Спасибо, Льюис! – Jon

То, что вы делаете на самом деле работает. Проблема в том, что html не заботится о добавленных пробелах, если вы не скажете это сделать. Вам нужен тег <pre>...</pre>. Это заставит html распознать ваши whitespaes и показать ваш JSON соответственно. Для этого вы можете, например, изменить свою последнюю строку с $("body").text(jsonPretty); на $("body").html("<pre>" + jsonPretty + "</pre>");. Это может быть не самое чистое решение, но оно работает и должно сделать вашу проблему понятной.

источник

2016-07-20 17:04:22

Prettify Generated JSON

ответ

Смежные вопросы