Pregunta Combinando: último-niño con: selector no (.class) en CSS


¿Es posible elegir el último niño que NO tiene un atributo de clase? Como tal:

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

Quiero seleccionar la tercera fila, en este caso.

Intenté lo siguiente, que no funcionó:

tr:not(.table_vert_controls):last-child

Gracias por adelantado.


32
2017-11-28 18:01


origen


Respuestas:


No solo con selectores de CSS, no, como :last-child específicamente mira el último niño, y no hay un similar :last-of-class pseudo-clase. Ver mi respuesta a esta pregunta relacionada.

A finales de 2015, las implementaciones comenzaron a llegar lentamente para la extensión de los selectores 4 a :nth-child() y :nth-last-child() que le permiten pasar un selector arbitrario como argumento (más sobre eso también en una actualización de la respuesta vinculada). Luego podrá escribir lo siguiente:

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

Aunque las implementaciones han empezado a enviarse recientemente, todavía tomará al menos unos pocos años más para que sea ampliamente compatible (a partir de abril de 2018, dos años y medio después de ser el primer navegador para enviar, Safari sigue siendo el único navegador que lo ha hecho) Mientras tanto, tendrás que usar otra cosa, como una clase extra justo antes de la clase en cuestión, o un selector jQuery:

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

27
2017-11-28 18:07