解析HTML表的JSON对象

Question

解析HTML表的JSON对象我试图显示基于JSON数据的“排行榜”表。我已经阅读了很多关于JSON格式并克服了一些初步障碍，但我的Javascript知识非常有限，我需要帮助！基本上我的JSON数据看起来像这样：[{"User_Name":"John Doe","score":"10","team":"1"},{"User_Name":"Jane Smith","score":"15","team":"2"},{"User_Name":"Chuck Berry","score":"12","team":"2"}]我需要的是能够遍历这个数组，为每个对象生成一个表行或列表项。数组中将有未知数量的总对象，但每个对象具有相同的格式 - 三个值：Name，Score，Team。到目前为止，我使用了以下代码，确认我已成功加载控制台中的对象 -$.getJSON(url,function(data){  console.log(data);});但我不知道如何迭代它们，将它们解析为HTML表格。下一步是按降序按分数对条目进行排序...任何帮助将非常感激。谢谢！编辑：下面更新了代码，这有效：$.getJSON(url,function (data) {    var tr;    for (var i = 0; i < data.length; i++) {        tr = $('<tr/>');        tr.append("<td>" + data[i].User_Name + "</td>");        tr.append("<td>" + data[i].score + "</td>");        tr.append("<td>" + data[i].team + "</td>");        $('table').append(tr);    }});（$ .parseJSON不是必需的，我们可以使用'data'，因为我已经解析了JSON数组）

Answer 1

循环遍历每个对象，每次迭代附加一个包含相关数据的表行。

$(document).ready(function () {
    $.getJSON(url,
    function (json) {
        var tr;
        for (var i = 0; i < json.length; i++) {
            tr = $('<tr/>');
            tr.append("<td>" + json[i].User_Name + "</td>");
            tr.append("<td>" + json[i].score + "</td>");
            tr.append("<td>" + json[i].team + "</td>");
            $('table').append(tr);
        }
    });});

的jsfiddle

Answer 2

遍历每个对象，推入字符串数组并加入它们。附加在目标表中，它更好。

$(document).ready(function () {$.getJSON(url,function (json) {
    var tr=[];
    for (var i = 0; i < json.length; i++) {
        tr.push('<tr>');
        tr.push("<td>" + json[i].User_Name + "</td>");
        tr.push("<td>" + json[i].score + "</td>");
        tr.push("<td>" + json[i].team + "</td>");
        tr.push('</tr>');
    }
    $('table').append($(tr.join('')));});