jquery - 使用 jQuery 在另一个 div 内的 div 之间切换？

Question

所以我有一个 div，里面可以有多个 div。像这样的东西:

<div id="news">         
    <span>Latest News!</span>       
    <div>
        //News 1    
    </div>
    <div>
        //News 2
    </div>
</div>

我想做的是在页面加载时，第一个 div 可见，然后过了很多秒，它淡出，第二个 div 淡入。对于 fadeIn 和 fadeOut 非常简单，但我必须指定每个 div 的行动。有没有办法说“在我的#news div 内的每个div 之间切换”？这样我就可以添加新的 div 而无需添加代码来隐藏/显示它们？

谢谢!

Answer 1

// count the number of news items
var len = $("#news div").length;

// hide all but the first
$("#news div:gt(0)").hide();

// set up a counter
var counter = 0;

// function to hide all except the current iteration
function changeDiv() {
    $("#news div").eq(counter).show().siblings("div").hide();
    counter++;

    // when we reach the last one, start again
    if(counter === len) {
        counter = 0;   
    }
}

// go!
var i = setInterval(changeDiv, 2000);

Demo.