显示一个元素5秒钟，然后隐藏并显示下一个元素

Question

到目前为止，这是我尝试过的方法，但是它只是一次显示所有元素：

i1 = document.getElementById('img_1');

i2 = document.getElementById('img_2');

i3 = document.getElementById('img_3');

i4 = document.getElementById('img_4');

i5 = document.getElementById('img_5');

myarr = [i1,i2,i3,i4,i5];

    for (i=0; i<myarr.length;i++) {  

       $(myarr[i]).show().delay(5000).fadeOut();

    } 

Answer 1

我认为您正在尝试实现无止境的循环。我认为您应该在这种情况下使用间隔，并对元素进行fadeOut / fadeIn。i1 = document.getElementById('img_1');i2 = document.getElementById('img_2');i3 = document.getElementById('img_3');i4 = document.getElementById('img_4');i5 = document.getElementById('img_5');let myarr = [i1, i2, i3, i4, i5];let active = 1;setInterval(() => {&nbsp; $(myarr[active - 1]).fadeOut(500)&nbsp; if (active >= myarr.length) {&nbsp; &nbsp; active = 0&nbsp; }&nbsp; setTimeout(() => {&nbsp; &nbsp; $(myarr[active]).fadeIn(500);&nbsp; &nbsp; active = active + 1;&nbsp; }, 500)}, 5000)这样做是每5秒更新一次元素到下一个元素，如果到达末尾，则将其重置为零。