Phương thức near() không hoạt động như mong đợi

Question

Tôi là ví dụ mẫu bên dưới, tôi không chắc tại sao ví dụ đầu tiên (sử dụng div) không nhận được văn bản khi văn bản thứ hai (sử dụng span) có thể đạt được điều đó với cùng một mã JS sử dụng closest():

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

---

đoạn đầu tiên (sử dụng div 's) không thể nhận được văn bản sử dụng 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>

---

Thứ hai đoạn (sử dụng span 's) nhận được văn bản sử dụng 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>

tôi biết về các lựa chọn thay thế parents()/parent()/siblings()/nextAll() có thể trả lại class-2 t ext trong trường hợp này, nhưng tôi chỉ muốn biết những gì xảy ra hành vi này.

Answer 1

Vì .closest() kiểm tra xem yếu tố gọi có vừa với bộ chọn hay không và trong trường hợp của bạn .class-1 cũng là div.

Từ các tài liệu:

Mô tả: Đối với mỗi phần tử trong tập hợp, được những yếu tố đầu tiên mà phù hợp với selector bằng cách kiểm tra các yếu tố bản thân và vượt qua lên thông qua tổ tiên của nó trong cây DOM.