使css nth-child（）仅影响可见

Question

有没有办法只用这个css影响可见元素？

table.grid tr.alt:nth-child(odd)
{
    background:#ebeff4;
}

table.grid tr.alt:nth-child(even)
{
    background:#ffffff;
}

如果我使用隐藏了某些行的$('select some tr:s').hide()，我会混合使用奇怪和均匀的样式，但这些都是混合的。

Answer 1

我最终使用了Rodaine在他的评论中提出的解决方案，在演出/隐藏之后我这样做了：

$('.alt:visible:odd').css('background', '#EBEFF4');
$('.alt:visible:even').css('background', '#FFFFFF'); 

在我的情况下，背景的设置打破了我的悬停，这是通过!important来解决的，以使悬停背景棒。

table.grid tr.hover:hover
{
    cursor:pointer;
    background:#D2E0E9 !important;    
}

Answer 2

另一种选择是在隐藏其他元素时将类应用于可见元素。将nth-child应用于此类（仅适用于可见元素。）

在这种情况下，您不必使用！important标记来保留悬停背景。

Answer 3

你可以这样做：

$('some_selector tr:visible').hide()

希望这有帮助