.addBack()

jQuery 공작소에 방문해 주셔서 감사드립니다. 쉬운 예제로 느껴보세요!!

addBack 메서드는 현재 셀렉터 기준으로 이전의 요소를 추가합니다.
설명이 좀 어렵네요. 예제로 확인해 봅시다 ^^

+_+
예제 1
먼저 비교해 보기 위한 일반 예제입니다. addBack 메서드 사용안함
보기

$( 'img:eq(1)' ).nextAll() - 두번째 닭 이후로 전부 반응합니다.
예제 2
addBack 메서드를 사용한 예제
보기

$( 'img:eq(1)' ).nextAll().addBack() - 두번째 닭을 포함하여 이후로 전부 반응합니다.
소스
<style type="text/css">
    .css_test {
        text-align : center;
        border-bottom : 5px solid #752600;
    }
    .css_test img {
        position : relative;
        z-index : 10;
    }
</style>

<div class="css_test">
    <img src="http://superkts.com/img/css/bird17.gif" />
    <img src="http://superkts.com/img/css/bird17.gif" />
    <img src="http://superkts.com/img/css/bird17.gif" />
    <img src="http://superkts.com/img/css/bird17.gif" />
</div>

<button type="button" onclick="j_test($('.css_test img:eq(1)').nextAll().addBack())">날아랏!</button><br>
$( 'img:eq(1)' ).nextAll().<b>addBack</b>() - 두번째 닭을 포함하여 이후로 전부 반응합니다.

<script type="text/javascript">
    // 제이쿼리를 매개변수로 받아서 간단한 애니메이션 처리
    function j_test(j){
        j.finish().animate({top:'-=100'}, 1000, function(){
            $(this).animate({top:'+=100'}, 500);
        });
    }
</script>
관련 CSS
jQuery

$( 'img:eq(1)' ).nextAll().addBack()
- 두번째 이미지 이후부터 전부를 그리고 두번째 이미지 이전것도 추가로 포함한것을 대상으로 함
- 두번째를 포함하여 그 이후 전부를 대상으로 합니다.
- nextAll 은 현재것을 포함하지 않는데 addBack 을 사용하여 현재것도 포함 하도록 했습니다.

예제 3
예제 조금 더 ! - 같은 것들 비교
보기


jQuery
- 첫 번째 닭 이후로 반응합니다.
jQuery 홈페이지 .addBack() API 문서 : http://api.jquery.com/addBack/