jQuery:Você pode selecionar por regra CSS, não por classe?
-
09-06-2019 - |
Pergunta
Um .container pode conter muitos .components, e os próprios .components podem conter .containers (que por sua vez podem conter .components etc.etc.)
Dado um código como este:
$(".container .component").each(function(){
$(".container", this).css('border', '1px solid #f00');
});
O que preciso adicionar à linha entre colchetes para selecionar apenas os .containers aninhados que têm sua largura em CSS definida como 'auto'?Tenho certeza que é algo simples, mas não tenho usado muito o jQuery.
Solução
$(".container .component").each(function()
{
$(".container", this).each(function() {
if($(this).css('width') == 'auto')
{
$(this).css('border', '1px solid #f00');
}
});
});
Semelhante à outra resposta, mas como os componentes também podem ter vários contêineres, também é necessário verificar .each() aqui também para a largura.
Outras dicas
Você pode querer investigar .filter()
.
Algo como:
$('.container .component .container')
.filter(function() {return $(this).css('width') == 'auto';})
.css({border: '1px solid #f00'});
$(".container .component").each(function() {
if ($(".container", this).css('width') === "auto")
$(".container", this).css('border', '1px solid #f00');
});
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow