写的这个JSON结果（解析JSON）

Question

我有这样的JSON结果这个HTML：

{ 
    "html_content": [ 
     [ 
      [ 
       "Navegantes", 
       "11", 
       "8", 
       "3", 
       "0" 
      ] 
     ], 
     [ 
      [ 
       "Tigres", 
       "11", 
       "8", 
       "3", 
       "0" 
      ] 
     ], 
     [ 
      [ 
       "Caribes", 
       "11", 
       "6", 
       "5", 
       "2" 
      ] 
     ], 
     [ 
      [ 
       "Leones", 
       "11", 
       "6", 
       "5", 
       "2" 
      ] 
     ], 
     [ 
      [ 
       "Aguilas", 
       "11", 
       "5", 
       "6", 
       "3" 
      ] 
     ], 
     [ 
      [ 
       "Tiburones", 
       "10", 
       "4", 
       "6", 
       "3.5" 
      ] 
     ], 
     [ 
      [ 
       "Cardenales", 
       "10", 
       "3", 
       "7", 
       "4.5" 
      ] 
     ], 
     [ 
      [ 
       "Bravos", 
       "11", 
       "3", 
       "8", 
       "5" 
      ] 
     ] 
    ] 
} 

而且我需要建立，对于每一个HTML标记像这样的：

<tr> 
    <td>Navegantes</td> 
    <td>11</td> 
    <td>8</td> 
    <td>3</td> 
    <td>0</td> 
    <td> 
     <span class="glyphicon glyphicon-play"></span> 
     <span class="glyphicon glyphicon-stop"></span> 
    </td> 
</tr> 
<tr> 
    <td>Tigres</td> 
    <td>11</td> 
    <td>8</td> 
    <td>3</td> 
    <td>0</td> 
    <td> 
     <span class="glyphicon glyphicon-play"></span> 
     <span class="glyphicon glyphicon-stop"></span> 
    </td> 
</tr> 

而且等等，我做了这样的代码：

$.each(data.html_content, function(i, v) { 
    htm += "here goes the HTML code"; 
}); 

但是这不起作用我认为由于数组类型，可以提供任何帮助吗？

Answer 1

事情是这样的：

for (var i = 0; i < data.html_content.length; i++) { 
    var tr = "<tr>"; 
    var td = ""; 
    for (var j = 0; j < data.html_content[i][0].length; j++) { 
     td += "<td>" + data.html_content[i][0][j] + "</td>"; 
    } 
    tr += td + "<td><span></span><span></span></td></tr>"; 
    $("table").append(tr); 
} 

Answer 2

您可以从头开始编写此代码，但有很多JS templating scripts available可以使用JSON。

请参阅：http://coding.smashingmagazine.com/2012/12/05/client-side-templating/他们如何工作。

Answer 3

下面是一个基本的解决方案弗朗划痕：

$.each(data.html_content, function(i, v) { 
    htm += '<tr>' + 
     ' <td>' + i[0][0] + '</td>' + 
     ' <td>' + i[0][1] + '</td>' + 
     ' <td>' + i[0][2] + '</td>' + 
     ' <td>' + i[0][3] + '</td>' + 
     ' <td>' + i[0][4] + '</td>' + 
     ' <td>' + 
     '  <span class="glyphicon glyphicon-play"></span>' + 
     '  <span class="glyphicon glyphicon-stop"></span>' + 
     ' </td>' + 
     '</tr>'; 
}); 

Answer 4

你可以尝试这样的事情（AN EXAMPLE.）

var table = $('<table/>') 
$.each(data.html_content, function(k, v){ 
    var tr = $('<tr/>'); 
    $.each(v[0], function(i, j){ 
     $('<td/>', { 'text':j }).appendTo(tr); 
    }); 
    var sp1 = $('<span/>', { 'class':'glyphicon glyphicon-play', 'text':'Play' }); 
    var sp2 = $('<span/>', { 'class':'glyphicon glyphicon-stop', 'text':'Stop' }); 
    var tdSpan = $('<td/>'); 
    tdSpan.append(sp1).append(sp2); 
    tr.append(tdSpan); 
    table.append(tr); 
}); 
$('body').append(table);