javascript - 显示 Json 值

Question

我现在一直在处理 json 值。我在 ajax 调用中返回 json 值。现在我想以特定格式显示 json。例如，让返回的值为

{"Heading 1":["Content 1","Content 2"],"Heading 2":["Content 1","COntent 2","Content 3"],"Heading3":["Content 1"]}

我想以这样的方式显示

<h4>Heading 1</h4> <input type="checkbox">Content 1<br><input type="checkbox">Content 2<br>
<h4>Heading 2</h4> <input type="checkbox">Content 1<br><input type="checkbox">Content 2<br><input type="checkbox">Content 3<br>
<h4>Heading 3</h4> <input type="checkbox">Content 1<br>

我应该怎么做？

Answer 1

试试这个方法：

var data, container, key, curHeading, heading, i, checkbox;

data = {"Heading 1":["Content 1","Content 2"],"Heading 2":["Content 1","COntent 2","Content 3"],"Heading3":["Content 1"]};

container = document.createElement("div");
for (key in data) {
    curHeading = data[key];
    heading = document.createElement("h4");
    heading.innerHTML = key;
    container.appendChild(heading);
    for (i = 0; i < curHeading.length; i++) {
        checkbox = document.createElement("input");
        checkbox.type = "checkbox";
        container.appendChild(checkbox);
        container.appendChild(document.createTextNode(curHeading[i]));
        container.appendChild(document.createElement("br"));
    }
}

document.body.appendChild(container);

演示：http: //jsfiddle.net/UwSU6/1/

事件中发生这种情况的window.onload位置（例如在 jsFiddle 中）

Answer 2

var json ={"Heading 1":["Content 1","Content 2"],"Heading 2":["Content 1","COntent 2","Content 3"],"Heading3":["Content 1"]}
obj = JSON.parse(json);


for ( evaluationHere){
    createTheElementsHEre()

}
insertHtml();