Jquery[제이쿼리] slice() 메서드 배우기

안녕하세요~ 제이쿼리공장장 주니주니 입니다.

오늘은 제이쿼리[jquery] slice() 메서드를 배워보겠습니다.
slice()메서드도 eq(),:lt(),:gt()처럼 인덱스 번호로 선택할 수 있습니다.

이렇게 준비해 보았습니다.

실행하면 이렇게 나오면 된답니다.

===============================
$('li').slice(3).css("color","blue");
===============================
<li>태그의 대상으로 slice()메서드를 사용하여 지정한 인덱스 번호보다
크거나 같은 <li>태그의 css를 변경하는 코드입니다.
전 인덱스 번호가 3보다 크거나 같은 <li>태그의 css를 변경하였습니다.

인덱스번호는 0 1 2 3 4 5 6 이런식으로 0부터 시작한답니다.

===============================
$('.b1').on("click",function(){
   var sl1 = $('.i1').val();
   var sl2 = $('.i2').val();
   $('li').slice(sl1,sl2).css("color","blue");
  });
===============================
class b1가 click되면
sl1와 sl2 변수에 요소1/요소2의 text박스의 value값을 각각 저장하도록 하였습니다.
slice()메서드를 통하여 입력한 sl1값/sl2값의 사이에 있는
<li>태그를 선택하여 css를 변경하도록하였습니다.

※slice()메서드는 slice(start,[end])로 구성되어있습니다.
[end]부분은 사용해도 되고 안해도된답니다.
둘다 사용시는 start부터 ~ end의 사이에 있는 부분을 선택하게된답니다.

요소1 에는 1 / 요소2에는 3이란 값을 입력한뒤
검색버튼을 눌러보았습니다.

오늘은 제이쿼리[jquery] slice() 메서드를 배워보았습니다.
그럼 다음에 또만나요~