jQuery:¿Puedes seleccionar por regla CSS, no por clase?

Question

Un .container puede contener muchos .components, y los .components mismos pueden contener .containers (que a su vez pueden contener .components, etc.etc.)

Código dado como este:

$(".container .component").each(function(){
  $(".container", this).css('border', '1px solid #f00');
});

¿Qué necesito agregar a la línea dentro de las llaves para seleccionar solo los contenedores anidados que tienen su ancho en CSS configurado en "automático"?Estoy seguro de que es algo simple, pero realmente no he usado mucho jQuery.

Answer 1

$(".container .component").each(function()
{
    $(".container", this).each(function() {
        if($(this).css('width') == 'auto')
        {
            $(this).css('border', '1px solid #f00');
        }
    });
});

Similar a la otra respuesta, pero dado que los componentes también pueden tener múltiples contenedores, también es necesario .each() verificar aquí el ancho.

Answer 2

Quizás quieras investigar .filter().

Algo como:

$('.container .component .container')
.filter(function() {return $(this).css('width') == 'auto';})
.css({border: '1px solid #f00'});

Answer 3

$(".container .component").each(function() {
    if ($(".container", this).css('width') === "auto")
        $(".container", this).css('border', '1px solid #f00');
});