javascript - jQuery kullanarak herhangi bir atada sınıf olup olmadığını kontrol et

jQuery'de herhangi bir ebeveynin, büyük ebeveynin veya büyük büyük ebeveynin bir sınıfa sahip olup olmadığını kontrol etmenin bir yolu var mı?

Kodda bu tür şeyleri yapmama neden olan bir işaretleme yapım var:

$(elem).parent().parent().parent().parent().hasClass('left')

Ancak, kod okunabilirliği için bu tür şeylerden kaçınmak isterim. 'Herhangi bir üst/ata/büyük-ata sınıfa sahip mi' demenin bir yolu var mı?

Ben jQuery 1.7.2 kullanıyorum.

Cevap #1

if ($elem.parents('.left').length) {

}

Cevap #2

Eleman atalarını filtrelemenin birçok yolu vardır.

if ($elem.closest('.parentClass').length /* > 0*/) {/*...*/}
if ($elem.parents('.parentClass').length /* > 0*/) {/*...*/}
if ($elem.parents().hasClass('parentClass')) {/*...*/}
if ($('.parentClass').has($elem).length /* > 0*/) {/*...*/}
if ($elem.is('.parentClass *')) {/*...*/}

Dikkat, closest() metodu, seçici kontrol edilirken öğenin kendisini de içerir.

Alternatif olarak, eğer $elem ile eşleşen benzersiz bir seçiciniz varsa, örneğin #myElem, şunu kullanabilirsiniz:

if ($('.parentClass:has(#myElem)').length /* > 0*/) {/*...*/}
if(document.querySelector('.parentClass #myElem')) {/*...*/}

Eğer bir öğeyi yalnızca stil amacıyla, herhangi bir üst öğesinin sınıfına bağlı olarak eşleştirmek istiyorsanız, sadece bir CSS kuralı kullanın:

.parentClass #myElem { /* CSS property set */ }

Cevap #3

Belirtilen .class seçici ile parents metodunu kullanabilir ve herhangi birinin ona uyup uymadığını kontrol edebilirsiniz:

if ($elem.parents('.left').length != 0) {
    //someone has this class
}

İlgili makaleler