2010-09-22 20 views
27
<div class="outer"> 
    <div class="inner"></div> 
</div> 

Jak znaleźć tutaj div wewnętrzny?jQuery w klasie selektor klasy

$container.find('.outer .inner')

właśnie będzie wyglądać na div z class="outer inner", czy to prawda?

więc próbowałem

$container.find('.outer > .inner')

ale które nie wydają się działać.

Edit:

znam jej łatwo znaleźć coś jak

$container.find('.outer').find('.inner')

ale szukam rodzaju składni pojedynczego wyboru, który brzmi lepiej IMHO.

+0

Jak zdefiniowano "$ container"? Poza tym, jeśli to możliwe, należy używać pojedynczych selektorów. Jest łatwiejszy do odczytania, jeśli nie musisz szukać różnych części selektora w całym miejscu. – jwueller

+0

"ale szukam takiej pojedynczej selektorowej składni, która brzmi lepiej imho." Powinieneś preferować sposób '.find (...)', ponieważ będzie on szybszy, im bardziej złożony będzie selektor lub jeśli użyjesz selektora, który nie jest obsługiwany przez przeglądarkę. W tym przypadku sizzle będzie używane do selekcji, która jest/może być naprawdę powolna w porównaniu do selektora dzielonego z '.find (...)'. – Andreas

Odpowiedz

58

właśnie będzie wyglądać na div class = "zewnętrzna wewnętrzna", czy to prawda?

Nie '.outer .inner' będzie szukać wszystkich elementów z klasą .inner które również element z klasy .outer jako przodka. '.outer.inner' (bez spacji) dałoby wyniki, o których myślisz.

'.outer > .inner' będzie szukać bezpośrednich dzieci elementu z .outer klasie elementów z klasy .inner.

Zarówno dla '.outer .inner', jak i dla '.outer > .inner' powinno działać na przykład, choć selektory są zasadniczo różne i powinieneś być ostrożny.

+1

Miałem kolejny błąd w moim kodzie, który doprowadził mnie do przekonania, że ​​mój selektor nie działa, ale w końcu był. Dziękuję za wyjaśnienie. – fearofawhackplanet

25

W tym html:

<div class="outer"> 
    <div class="inner"></div> 
</div> 

Ten selektor powinno działać:

$('.outer > .inner')