jQuery 강좌 | Methods > .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번째까지 빨간색으로 만듭니다.

예제

<!doctype html>
<html lang="ko">
  <head>
    <meta charset="utf-8">
    <title>jQuery</title>
    <script src="//code.jquery.com/jquery-3.2.1.min.js"></script>
    <script>
      jQuery( document ).ready( function() {
        $( 'ol.a li' ).slice( 2, 4 ).css( 'color', 'red' );
        $( 'ol.b li' ).slice( -4, -2 ).css( 'color', 'red' );
      } );
    </script>
  </head>
  <body>
    <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>
  </body>
</html>

Category

Created on 2017-04-13 12:01 | Updated on 2017-04-13 12:01

이 글을 공유하기

Kakao

기초 강좌