목차
- slice() 예제 - 양수 (start <= index)
- slice() 정의
- slice() 구문
- slice() 예제 - 양수 (start <= index < stop)
- slice() 예제 - 음수 (start <= index)
- slice() 예제 - 음수 (start <= index < stop)
slice() 예제 - 양수 (start <= index)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("p").slice(2).css("background-color", "yellow");
});
</script>
<h1>홈짱닷컴 Homzzang.com</h1>
<p>index 0</p>
<p>index 1</p>
<p>index 2</p>
<p>index 3</p>
결과보기
slice() 정의
선택자가 가리키는 요소 중, 특정 색인번호 범위 내 요소만 선택.
1.
색인번호 범위: start <= index < stop
2.
stop 없는 경우, 마지막 요소까지 자동 선택.
slice() 구문
$(selector).slice(start,stop)
[매개변수]
start
필수. 시작 색인번호. (포함 O). (색인은 0부터 시작)
앞부터 색인 : 0부터 시작.
뒤부터 색인 : -1부터시작
stop
선택. 종료 색인번호. (포함 X)
[반환값]
start <= index < stop 범위의 요소 선택.
stop 없는 경우, 마지막 요소까지 자동 선택.
slice() 예제 - 양수 (start <= index < stop)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("p").slice(2,4).css("background-color", "yellow");
});
</script>
<h1>홈짱닷컴 Homzzang.com</h1>
<p>index 0</p>
<p>index 1</p>
<p>index 2</p>
<p>index 3</p>
<p>index 4</p>
<p>index 5</p>
결과보기
slice() 예제 - 음수 (start <= index)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("p").slice(-3).css("background-color", "yellow");
});
</script>
<h1>홈짱닷컴 Homzzang.com</h1>
<p>index 0</p>
<p>index 1</p>
<p>index 2</p>
<p>index 3</p>
<p>index 4</p>
<p>index 5</p>
결과보기
slice() 예제 - 음수 (start <= index < stop)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("p").slice(-3,-1).css("background-color", "yellow");
});
</script>
<h1>홈짱닷컴 Homzzang.com</h1>
<p>index 0</p>
<p>index 1</p>
<p>index 2</p>
<p>index 3</p>
<p>index 4</p>
<p>index 5</p>
결과보기