Question

我们可以通过以下代码将一组JSON数据转换为html表：

$.each(data, function(key, val) {
    var tr=$('<tr></tr>');
    $.each(val, function(k, v){
        $('<td>'+v+'</td>').appendTo(tr);
    });
    tr.appendTo('#display');
});

html表是：

<table border='1' id="display">

    <thead>
            <tr>
                <th>firstcol</th>
                <th>loc</th>
                <th>lastA</th>
                <th>mTime</th>
                <th>nTime</th>
                <th>Age</th>
                <th>ction</th>
            </tr>
        </thead>        
</table>

以下工作示例：http://jsfiddle.net/AHv6c/（来源jquery code to display json response to a html table using append）

我的问题是某些行列可以有自己的样式类。

所以我想将表<th>的某些内容更改为<th class='sampleStyle'>。您能否告诉我如何更改java脚本以从th读取相应的类并将其分配给相关列。

然后生成的表应该是：

<tr>
     <td>56036</td>
     <td class="sampleStyle">Deli</td>
     ....

那么你知道更好的方法吗？

Answer 1

您可以尝试http://www.jqversion.com/#!/Mdi8Kla

之类的内容

$.each(data, function(key, val) {
    var tr    = $('<tr></tr>'),
        index = 0;
    $.each(val, function(k, v){
        $('<td>'+v+'</td>').addClass(
          $('th:eq(' + index + ')').attr('class')
        ).appendTo(tr);
        index++;
    });
    tr.appendTo('#display');
});

Answer 2

$("td:eq(0)", tr).addClass("sampleStyle");

在追加tr

之前

JSON到html STYLED表

2 个答案: