结合：CSS中的last-child与：not（.class）选择器

Question

是否可以选择没有课程attr的最后一个孩子？ 像这样：

<tr> ... </tr>
<tr> ... </tr>
<tr> ... </tr>
<tr class="table_vert_controls"> ... </tr>

我想选择第三行，在这种情况下。

我尝试了以下操作，但没有效果：

tr:not(.table_vert_controls):last-child

提前致谢。

Answer 1

不单独使用CSS选择器，不，因为:last-child专门查看最后一个子，并且没有类似的:last-of-class伪类。请参阅我对this related question的回答。

截至2015年底，实施已经开始慢慢地为Selectors 4扩展到:nth-child()和:nth-last-child()，这允许您将任意选择器作为参数传递（更多内容也在更新中）相关的答案）。然后，您将能够编写以下内容：

tr:nth-last-child(1 of :not(.table_vert_controls))

虽然最近已开始实施，但至少还需要几年的时间才能得到广泛支持（截至2018年4月，也就是第一批浏览器发布后的两年半，{{3} }）。与此同时，你将不得不使用其他东西，比如在有问题的类之前的额外类或jQuery选择器：

$('tr:not(.table_vert_controls):last')

Answer 2

您可以使用以下解决方案：

tr:not(.table_vert_controls):nth-last-of-type(2)