일치하는 요소의 일부분만 선택하는 방법 - .slice()

.slice()

.slice()는 일치하는 요소의 일부분만 선택합니다.

 

기본형

.slice( start [, end ] )

예를 들어

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

는 li 요소 중 3번째부터 빨간색으로 만듭니다.

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

는 li 요소 중 3번째부터 5번째까지 빨간색으로 만듭니다.

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

는 li 요소 중 뒤에서 4번째부터 뒤에서 3번째까지 빨간색으로 만듭니다.

 

예제

<ol class="a">
  <li>One</li>
  <li>Two</li>
  <li>Three</li>
  <li>Four</li>
  <li>Five</li>
</ol>

<ol class="b">
  <li>One</li>
  <li>Two</li>
  <li>Three</li>
  <li>Four</li>
  <li>Five</li>
</ol>

jQuery( document ).ready( function() {
  $( 'ol.a li' ).slice( 2, 4 ).css( 'color', 'red' );
  $( 'ol.b li' ).slice( -4, -2 ).css( 'color', 'red' );
});