javascript - CSS：nth-​​child（偶数）选择器背景颜色不起作用

Question

我试图在两行上均匀地显示背景颜色:nth-child(even)，但它不起作用，但它在 jsfiddle.net 上工作（没有 javascript 来生成表格）。

调用 JSON 文件后生成表 -

$(document).ready(function() {
    $.getJSON("js/dataPokerPlayers.json", function(data) {
        $.each(data, function(i, data){
            $(".tableData tbody").append("<tr><td class=\"centertext\">" + data.rank + "</td><td>" + data.name + "</td><td class=\"centertext\">" + data.earnings + "</td><td class=\"centertext\">" + data.points + "</td><td class=\"centertext\">" + data.totalearnings + "</td></tr>");
        });
    });
});

CSS

.tableData tbody tr:nth-child(even) {
    background-color:#212121;
}

HTML

<table class="tableData">
    <thead>
        <tr>
        <th>Rank</th>
        <th width="250">Name</th>
        <th>Earnings</th>
        <th>Points</th>
        <th>Total Earnings</th>
        </tr>
    </thead>
    <tbody></tbody>
</table>

Answer 1

以下 CSS 代码将起作用。

.tableData > tbody > tr:nth-child(2n) {
background-color:#212121;}