jQuery 트리버전 - nextAll() 메서드

예제

첫 번째 div 다음의 모든 클래스 이름을 찾아 그들에게 클래스 이름을 추가합니다:

$("div:first").nextAll().addClass("after");

직접 시도해 보세요

정의와 사용법

nextAll()은 일치하는 요소 집합의 각 요소의 모든 이어지는 형제 요소를 얻습니다. 선택자를 필터링하는 것은 선택적입니다.

문법

.nextAll(selector)
파라미터 설명
selector 문자 값, 요소를 일치시키기 위해 사용되는 선택자 표현식을 포함합니다.

상세 설명

DOM 요소 집합을 나타내는 jQuery 객체가 주어진 경우, .nextAll() 메서드는 DOM 트리에서 요소가 따르는 형제 요소를 검색하고, 일치하는 요소로 새로운 jQuery 객체를 생성할 수 있습니다.

이 메서드는 선택자 표현식을 받아들이며, $() 함수에 전달한 类型과 동일합니다. 선택자를 적용하면 요소가 일치하는지 확인하여 요소를 필터링합니다.

아래와 같은 간단한 목록을 가진 페이지를 생각해 보세요:

<ul>
   <li>list item 1</li>
   <li>list item 2</li>
   <li class="third-item">list item 3</li>
   <li>list item 4</li>
   <li>list item 5</li>
</ul>

프로젝트 3부터 시작하면, 그 다음에 나타나는 요소를 찾을 수 있습니다:

$('li.third-item').nextAll().css('background-color', 'red');

직접 시도해 보세요

이번 호출 결과는, 프로젝트 4와 5가 빨간 배경으로 설정되었습니다. 선택자 표현식을 적용하지 않았기 때문에, 그 다음 요소는 명확하게 객체의 일부로 포함되었습니다. 선택자를 적용한 경우, 포함하기 전에 요소가 일치하는지 확인합니다.