[J] JavaScript & jQuery 공부하기 #33

경기도 일자리 재단에서 수업을 배웠고 자료를 참고하여 공부를 해보았다.

 

38. 형제 요소 선택 함수
   * 형제 관계의 개요
    - 같은 부모를 가지고, 특정 요소와 동일한 단계에 위치하는 모든 요소들

   * siblings()
    - 특정 요소와 형제 관계에 있는 모든 요소 반환
    < script type="text/javascript">
      $(document).ready(function(){
        $("h4").siblings();
      });
    </ script>

   * next()
    - 특정 요소 바로 다음에 오는 형제 요소 반환
    < script type="text/javascript">
      $(document).ready(function(){
        $("h4").next();
      });
    </ script>

   * nextAll()
    - 특정 요소 다음에 오는 모든 형제 요소 반환
    < script type="text/javascript">
      $(document).ready(function(){
        $("h3").nextAll();
      });
    </ script>

   * nextUntil()
    - 특정 요소 이후부터의 속성값으로 주어진 요소 사이의 모든 형제 요소 반환
    - 속성값으로는 앞에 선언한 요소 이후에 나오는 형제 요소 값을 입력함
    < script type="text/javascript">
      $(document).ready(function(){
        $("h3.a").nextUntil("h6");
      });
    </ script>

   * prev()
    - 특정 요소 전에 오는 형제 요소 반환
    < script type="text/javascript">
      $(document).ready(function(){
        $("h3").prev();
      });
    </ script>

   * prevAll()
    - 특정 요소 전에 오는 모든 형제 요소 반환
    < script type="text/javascript">
      $(document).ready(function(){
        $("h3").prevAll();
      });
    </ script>

   * prevUntil()
    - 특정 요소 이전부터의 속성값으로 주어진 요소 사이의 모든 형제 요소 반환
    - 속성값으로는 앞에 선언한 요소 이전에 나오는 형제 요소 값을 입력
    < script type="text/javascript">
      $(document).ready(function(){
        $("h3").prevUntil("span.a");
      });
    </ script>