使用选择器获取具有特定背景色的所有tr

Question

我的桌子上有很多行。 一些行具有特殊的颜色，我想使用jquery获得该tr元素的数组。 我使用了选择器但没有用

$("#tbodySample").children("tr[background-color='rgb(79,79,79)']").length;

$("#tbodySample").children("tr[style='background-color:rgb(79,79,79)']").length;

$("#tbodySample").children("tr[style='{background-color:rgb(79,79,79)}']").length;

$("#tbodySample").children("tr[background-color='#4F4F4F']").length;

$("#tbodySample").children("tr[style='background-color:#4F4F4F']").length;

$("#tbodySample").children("tr[style='{background-color:#4F4F4F}']").length;

我的HTML是

<table>
<tbody id="tbodySample">
<tr class="selectable" style="background-color: rgb(79, 79, 79);">contents</tr>
<tr class="selectable" style="background-color: rgb(52, 52, 52);">contents</tr>
<tr class="selectable" style="background-color: rgb(52, 52, 52);">contents</tr>
<tr class="selectable" style="background-color: rgb(52, 52, 52);">contents</tr>
<tr class="selectable" style="background-color: rgb(79, 79, 79);">contents</tr>
.
.
.
</tbody>
</table>

上面所有语句均返回0。是否有可靠的方法来实现？

Answer 1

您可以使用滤镜检查背景色。 我正在针对十六进制值和rgb值检查.css('color') ，以确保跨浏览器兼容：

var count = $('#tbodySample').find('tr').filter(function(){
    var colors = ["#4F4F4F","rgb(79, 79, 79)"];
    return $.inArray($(this).css('background-color'), colors) !== -1;
}).length;

JSFiddle

注意：您的HTML无效， <td>元素必须是直接子元素或<tr>元素

Answer 2

尝试这个：

$("#tbodySample tr[style*='background-color: rgb(79, 79, 79);']").length