使用 JavaScript 从 JSON 数据生成完全通用/动态列表/表答案

【问题标题】：Fully Generic/Dynamic List/table generation from JSON Data using JavaScript使用 JavaScript 从 JSON 数据生成完全通用/动态列表/表
【发布时间】：2012-11-08 07:59:51
【问题描述】：

我正在为我的应用程序中的SQL 查询开发通用前端，并希望提供一个预览功能来呈现查询结果。

Web 服务以JSON 格式返回查询结果，JSON 布局当然因查询而异。

结果应该以完全动态的方式呈现，看起来像这样：

Column 1    Column 2    Column 3  
aaaaaaa     bbbbbbbb    ccccccc
.
.
.

无论是否使用模板库，都应在代码中生成列标题（来自 json 键）和行内容（来自 json 值）。

关于什么是最简单和/或最有效的方法有什么建议吗？

【问题讨论】：

我的回答对你有帮助吗？如果是这样，您可能想选择它作为问题的答案..

标签： json list parsing templates dynamic

【解决方案1】：

应该这样做：

function createTableFromJson(json){
    var table = "<table><tr>";
    $.each(json.results[0], function(key, value){
        table+= "<th>" + key + "</th>";
    });
    table += "</tr>";
    $.each(json.results, function(key, value){
        table +="<tr>";
        $.each(value, function(k,v){
            table += "<td>" + v + "</td>";
        });
        table +="</tr>";
    });
    table += "</table>";
    return table;
}

查看this jsfiddle 以获取完整示例。

【讨论】：