jQuery 순회 - prevUntil() 메서드

jQuery 순회 참조 매뉴얼

예제

모든 단락을 선택한 후, 선택된 내용을 첫 번째와 두 번째 단락만 포함하는 것으로 축소합니다：

$("p").slice(0, 2).wrapInner(");

본인이 직접 시도해 보세요

정의와 사용법

slice()는 일치하는 요소 집합을 지정된 지수 범위의 부집합으로 축소합니다.

문법

.slice(selector,end)
매개변수 설명
selector

0을 기준으로 한 정수 값, 선택을 시작할 요소 위치를 나타냅니다.

음수인 경우, 집합 끝에서 시작하는 오프셋을 나타냅니다.
end

0을 기준으로 한 정수 값, 선택을 끝낼 요소 위치를 나타냅니다.

음수인 경우, 집합 끝에서 시작하는 오프셋을 나타냅니다.

생략된 경우, 선택 범위는 집합의 끝에서 끝납니다.

상세 설명

jQuery 객체가 DOM 요소 집합을 나타내는 경우, .slice() 메서드는 일치하는 요소의 부집합을 구성하는 새로운 jQuery 객체를 생성합니다. 적용된 index 매개변수 집합 중 하나의 요소 위치; end 매개변수를 생략하면, index 이후의 모든 요소가 결과에 포함됩니다.

이 간단한 목록을 가진 페이지를 생각해 보세요:

<ul>
  <li>목록 항목 1</li>
  <li>목록 항목 2</li>
  <li>목록 항목 3</li>
  <li>목록 항목 4</li>
  <li>목록 항목 5</li>
</ul>

이 메서드를 목록 항목 집합에 적용할 수 있습니다:

$('li').slice(2).css('background-color', 'red');

본인이 직접 시도해 보세요

이번 호출의 결과는 항목 3, 4, 5의 배경이 빨간색으로 설정됩니다. 주의해야 할 것은 이미 적용된 index 매개변수는 0을 기준으로 하며, jQuery 객체의 요소 위치를 나타내며, DOM 트리의 위치를 나타내지 않는다는 점입니다.

end 매개변수는 선택 범위를 더욱 제한할 수 있습니다. 예를 들어:

$('li').slice(2, 4).css('background-color', 'red');

본인이 직접 시도해 보세요

이제, 항목 3과 4만 선택됩니다. 다시 말해, index는 0을 기준으로 합니다; 범위는 지정된 index까지(포함되지 않음) 확장됩니다.

음수 지수

jQuery의 .slice() 메서드는 JavaScript 배열 객체의 .slice() 메서드를 모방합니다. 그가 모방하는 특성 중 하나는 start 또는 end 매개변수에 음수 값을 전달할 수 있습니다. 음수 값을 제공하면, 그것은 시작 또는 끝에서부터의 위치를 나타내며, 시작에서부터의 위치가 아닙니다. 예를 들어:

$('li').slice(-2, -1).css('background-color', 'red');

본인이 직접 시도해 보세요

이번에는 목록 항목 4만 빨간색으로 변할 것입니다. 이는 이 프로젝트가 끝에서부터 세 번째(-2)와 끝에서부터 두 번째(-1)의 범위 사이에 유일한 항목이기 때문입니다.

jQuery 순회 참조 매뉴얼