jQuery 追加到表格和 td 背景颜色答案

【问题标题】：jQuery append to table and td background colorjQuery 追加到表格和 td 背景颜色
【发布时间】：2013-07-15 01:40:25
【问题描述】：

在使用 jQuery 将行附加到表后，我无法更改 td 的背景颜色。

这是我的代码，它可以工作并附加行（没有尝试更改单元格的颜色：

$( "#table_1 tbody" ).append( "<tr>" +
                              "<td>Some text</td>" +
                              "<td></td>" + 
                              "<td></td>" +
                              "<td>" + var1.val() + "</td>" +
                              "<td></td>" +
                              "</tr>" );

我想将所有空单元格（即带有"<td></td>" 的单元格）变灰。我希望它们具有灰色背景色，以便用户知道它们是空的或不活动的。你能帮忙吗？

我尝试使用普通的 html 标签来更改 td 颜色，但它不起作用： "<td style="background-color:#C0C0C0"></td>"

我是 jQuery 新手，所以我不确定如何实现这一点。感谢您的帮助！

【问题讨论】：

没有 CSS 类？也许 .shaded: background-color: #C0C0C0 和 .addClass('shaded') 在追加的末尾？

标签： jquery colors append html-table

【解决方案1】：

具体看一下Jquery手册：

http://api.jquery.com/empty-selector/

这给出了例子

$("td:empty").css('background', 'rgb(255,220,200)');

祝你好运

【讨论】：

【解决方案2】：

您只需使用 CSS 即可：

#table_1 td:empty {
    background-color: grey;
}

:empty 不支持 IE8 及以下版本，因此您可以使用 CSS3 polyfill，或者如果您坚持使用 jQuery，请使用 jQuery 的 :empty：

$('#table_1 td:empty').addClass('empty');

【讨论】：