我JSON.stringify是一个 json 对象
result = JSON.stringify(message, my_json, 2)
在2上面的说法应该是相当打印结果。如果我做类似的事情，它会这样做alert(result)。但是，我想通过将其附加到 div 中来将其输出给用户。当我这样做时，我只显示一行。（我认为它不起作用，因为中断和空格没有被解释为 html？）
{ "data": { "x": "1", "y": "1", "url": "http://url.com" }, "event": "start", "show": 1, "id": 50 }
有没有办法以JSON.stringify漂亮的打印方式将结果输出到 div？
请使用<pre> 标签
演示：http : //jsfiddle.net/K83cK/
var data = {
"data": {
"x": "1",
"y": "1",
"url": "http://url.com"
},
"event": "start",
"show": 1,
"id": 50
}
document.getElementById("json").textContent = JSON.stringify(data, undefined, 2);<pre id="json"></pre>确保 JSON 输出在<pre>标签中。
我的建议基于：
var x = { "data": { "x": "1", "y": "1", "url": "http://url.com" }, "event": "start", "show": 1, "id": 50 };
document.querySelector('#newquote').innerHTML = JSON.stringify(x, null, 6)
.replace(/\n( *)/g, function (match, p1) {
return '<br>' + ' '.repeat(p1.length);
});<div id="newquote"></div>如果您的<pre>标签显示单行 JSON，因为字符串已经是这样提供的（通过 api 或某些不受您控制的函数/页面），您可以像这样重新格式化它：
HTML：
<pre id="json">{"some":"JSON string"}</pre>
JavaScript：
(function() {
var element = document.getElementById("json");
var obj = JSON.parse(element.innerText);
element.innerHTML = JSON.stringify(obj, undefined, 2);
})();
或 jQuery：
$(formatJson);
function formatJson() {
var element = $("#json");
var obj = JSON.parse(element.text());
element.html(JSON.stringify(obj, undefined, 2));
}
完全披露我是这个包的作者，但另一种以可读的方式输出 JSON 或 JavaScript 对象的方法是能够跳过部分，折叠它们等nodedump，https://github.com/ragamufin/nodedump