Question

我的页面上有一些Javascript，它会进行ajax调用，返回一些JSON数据。

结果我这样做：

results = JSON.stringify(data, undefined, 2);
console.log(results);
$('.box').append(results);

.box只是一个空div。

console.log(results)为我提供了包含换行符的缩进结果，但.box中的数据只是一行中的数据。

如何确保.box中的结果也在多行并缩进？

Answer 1

.box只是一个空div。

改为空<pre>：

<pre class="box"></pre>

Answer 2

我同意使用<pre>，但另一个选项是将所有\n替换为<br>元素，将空格替换为 。它可能真的没必要（因为<pre>保留了空格）。你可以尝试：

var data = {key1: "value1", key2: "value2", key3: {key4: "value4"}},
    results = JSON.stringify(data, undefined, 2),
    results2 = results.replace(/\n/g, "<br>").replace(/[ ]/g, "&nbsp;");
console.log(results);
$(".box").append(results2);

DEMO： http://jsfiddle.net/Yk5Pb/3/

带有换行符的HTML中的JSON

2 个答案: