javascript - 使用 javascript 在表格中添加 CSS 样式

Question

在http://www.elitedeafpoker.com/dev/poker-players.html - AJAX 将 JSON 数据加载到表格中，我试图添加一些类以仅在两个标签上分别显示背景颜色并将文本居中，但它对我不起作用，我将其删除。我需要桌子看起来像这样 - http://www.elitedeafpoker.com/dev/img/table-example.jpg

Javascript

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

Answer 1

您可以添加到要居中class="center"的元素中，然后使用 CSS 选择器为这些元素设置类名的样式。<td>tdcenter

jQuery：

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

CSS：

.center{
    text-align: center;
}