본문 바로가기
javaScript/jQuery

[jQuery] 다음 형제 요소 찾기

by mooyou 2023. 1. 18.
728x90
300x250
SMALL

next()

prev()메서드와 반대되는 메서드로 특정 요소의 바로 다음에 있는 형제 요소를 찾고 싶을 때 사용

$대상.next()
$대상.nextAll(["선택자"])

 

<script>
    $(document).ready(function() {
        $("ul.list .on").next().css("border","3px solid #f00");
    });
</script>

<ul class="list">
    <li>A</li>
    <li class="on">B</li>
    <li>C</li>
    <li>D</li>
</ul>

 

실행결과

 

 

nextAll()

특정 노드를 기준으로 다음에 등장하는 모든 요소 선택

<script>
    $(document).ready(function() {
        $("ul.list .on").nextAll().css("border","3px solid #f00");
    });
</script>

<ul class="list">
    <li>A</li>
    <li class="on">B</li>
    <li>C</li>
    <li>D</li>
</ul>

실행결과

 

 

 

 

728x90
반응형
LIST

댓글