带有换行符的HTML中的JSON

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);

演示: http ://jsfiddle.net/Yk5Pb/3/