eq 및 n 번째 자식 DOM 검색

Question

내 브라우저에서 테스트를 통해 eq가 DOM 트리를 위에서 아래로 검색하고 첫 번째 요소를 찾은 후 중지합니다.

반면 nth-child는 전체 DOM 트리를 위에서 아래로 검색하고 그 길을 따라 모든 관련 요소를 대상으로합니다.

예 :이 요소를 발견하면

$('div').children('p:nth-child(2)').css('color', 'red') 

$('div').children('p').eq(3).text('text edited with (eq)'); 

실제로 DOM 검색을 중지 EQ합니까?

Answer 1

두 경우 모두 DOM 전체가 먼저 DIV에 대해 검색됩니다.

첫 번째 경우 해당 DIV의 세 번째 하위 항목이 P인지 확인합니다. 이는 세 번째 단락이 아니라 세 번째 하위 항목을 찾기 때문에 매우 짧은 검색입니다. 따라서 요소 유형에 상관없이 지정된 n 번째 자식 이후에 검색을 더 이상 수행 할 필요가 없으므로 중지됩니다.

두 번째 경우에 쿼리는 모든 Ps (해당 DIV의 하위 항목)를 검색 한 다음 해당 하위 집합을 검색하여 any가 세 번째 단락인지 확인합니다. 그래서,이 경우에는 3 번째 P에서 멈추지 않습니다. 왜냐하면 먼저 모든 Ps를 찾아 내고 그 다음에 내려 오기 때문입니다.