[jQuery] 같은 부모 아래 다른 자식 요소 찾기 / 형제자매 요소 select .siblings()

★ 특정 형재자매 요소 찾기 .siblings( ) 

 현재 위치에서 다른 형제자매 요소 select하기 위해서는 siblings() 라는 함수를 이용하면 된다.

>> 예제 소스

<ul class="boardList">
    <li class="post1"><span>
        <span>첫번째 게시글</span>
        <span><a href="#" class="btnUp">위로 이동</span></a>
        <span><a href="#" class="btnDown">아래로 이동</span></a>
        <span><a href="#" class="btnDelete">삭제</span></a>
    </span></li>
    <li class="post2"><span>
        <span>두번째 게시글</span>
        <span><a href="#" class="btnUp">위로 이동</span></a>
        <span><a href="#" class="btnDown">아래로 이동</span></a>
        <span><a href="#" class="btnDelete">삭제</span></a>
    </span></li>
    <li class="post3"><span>
        <span>세번째 게시글</span>
        <span><a href="#" class="btnUp">위로 이동</span></a>
        <span><a href="#" class="btnDown">아래로 이동</span></a>
        <span><a href="#" class="btnDelete">삭제</span></a>
    </span></li>
</ul>

>> 현재위치

$(.boardList .post2 .btnUp)

 

Q. 현재 두번째 게시글의 위로버튼 에 위치해 있을때 '두번째 게시글' 이라는 텍스트를 select 하는 방법은?

>> 해결방법

$(.boardList .post2 .btnUp).siblings('span').text() // 출력 : "두번째 게시글"

siblings() 함수를 통해 내가 찾고자하는 형제 태그를 찾은 후 텍스트를 구해야하므로 text()함수를 이용해 결과물을 얻는다.

요로코롬 형재자매님 다 모여라~~