javascript - 使用 JSON 在 Javascript 中生成动态表

Question

我想制作一个用 JSON 构建的 Javascript 表。此 JSON 是从后端(使用 Django)发送的，因此可以随时更改。 列的名称将是类别。我的 JSON 表单如下所示:

var data = [
{
    "title": "Leadership",
    "category": "humaninteraction"
},
{
    "title": "Maintenance procedures",
    "category": "procedures"
},
{
    "title": "Situational Awareness",
    "category": "environmentsituations"
},
{
    "title": "Self-Criticism",
    "category": "self"
},
{
    "title": "Tools",
    "category": "aircraft"
}]; 

Answer 1

您可以使用 $.getJSON() 从后端获取 JSON 并使用 $.each() 构建每一行.像这样:

function generateTable(){    
    var rows = '';
    $.getJSON( "backend/method", function( data ) {
      $.each( data, function( key, val ) {
        rows += '<tr>';
        rows += '<td>' + data.title + '</td>';
        rows += '<td>' + data.category+ '</td>';
        rows += '</tr>';
      });
    });
    $('#tableId').append(rows);
}