metoda closest() nie działa zgodnie z oczekiwaniami

Question

Mam przykładowy przykład poniżej, nie jestem pewien, dlaczego pierwszy przykład (przy użyciu div) nie dostał tekstu, gdy drugi (używając span) mógłby osiągnąć z tego samego kodu JS używając closest():

$('.class-1').closest('div').find('.class-2').text() 

---

Pierwszy urywek (używając div „s) mogę uzyskać tekst używając closest():

console.log($('.class-1').closest('div').find('.class-2').text());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <div class="class-1">Div 1 Content</div> 
 
    <div class="class-2">Div 2 Content</div> 
 
</div>

---

Drugi fragment (używając span'S) uzyskanie tekstu przy użyciu closest():

console.log($('.class-1').closest('div').find('.class-2').text());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <span class="class-1">Div 1 Content</span> 
 
    <br/> 
 
    <span class="class-2">Div 2 Content</span> 
 
</div>

wiem o alternatywnych parents()/parent()/siblings()/nextAll() że może zwrócić class-2 t ext w tym przypadku, ale chcę po prostu wiedzieć, co się dzieje z takim zachowaniem.

Answer 1

Ponieważ .closest() sprawdza, czy element wywołujący pasuje również do selektora, aw twoim przypadku .class-1 jest również div.

Od docs:

Opis: Dla każdego elementu w zestawie, zdobyć pierwszy element, który pasuje do selektora testując samego elementu i przechodzenie w górę przez jego przodków w drzewie DOM.