.next 그리고 제대로 작동하지 않는 경우

Question

나는 시간이 지남에 따라 계속 커질 수있는 회전 목마를 만들려고 노력하고 있습니다. DOM 구조는

<div> 
    <div class='active> 
    <anchor & image> 
    </div> 
    <div> 
    <anchor & image> 
    </div> 
</div> 

내가 함수를 쓴입니다해야 중첩 된 div의 순환 그리고 끝에 도달 할 때의

function carousel(){ 

setInterval(function(){ 

    var $active = $('.active'); 
    var $next = $('.active').next(); 

    if ($next == undefined){ 

     alert('if triggered'); 

     $next = $('.active').parent().children(':first-child'); 

     alert('first child selected'); 
    }; 

    alert('removing active class from active') 
    $active.removeClass("active"); 

    alert('adding active class to next') 
    $next.addClass('active'); 

}, 6000); 
} 

기능이 활성을 제거 최초의 중첩 된 DIV로 돌아 가기로되어 클래스를 생성하고 다음 중첩 div에 대입합니다. 그러나 다음 간격에서 if가 첫 번째 중첩 div로 되돌아 가도록 트리거 할 것으로 예상되는 경우에는 그렇지 않습니다. 그 다음은 형제를 다룰 때만 작동한다고 생각했는데, 마지막으로 중첩 된 div가 형제가 된 후에 형제가 정의되지 않아서 if 문을 트리거하지 않아야한다고 생각 했나요?

Answer 1

.next()은 다음 요소가 없으면 undefined를 반환하지 않고 빈 jQuery 객체를 반환하므로 if 조건이 실패합니다. Fiddle

Answer 2

없음이 정의되지 않은 반환하지 않습니다 : 그래서 당신은 다음 요소

if ($next.length == 0){ 

데모에게이 있는지 여부를 확인하기 위해 $next 개체의 .length 속성을 확인할 수 있습니다. 길이가 0 이상일 수있는 배열과 같은 객체를 반환합니다. undefined가 돌려 주어지면, 체인은 셀렉터에 일치하는 것이없는 경우, 중단 해 예외를 슬로우합니다.