javascript - 如何设置图像数组并单独循环它们

Question

对于 JavaScript 经验丰富的人来说，这可能是相当简单的任务。我想要一组图像，然后循环显示每个图像，每个图像之间有一定的时间间隔。

1. 将图像存储在数组中: var anArray = [image1, image2, image] (我可以通过简单地将图像的 src 放入这样的数组中来将图像放入数组中吗？当我尝试时，它会将每个图像视为字符串。)
2. 创建一个循环来遍历数组中的每个图像并淡入每个图像: for (var i = 0; i <= array.length; i++) 但我不希望它在所有图像中淡入淡出一次，我一次想要一个。
3. 设置时间间隔:setInterval(functioin() {}, 1000);这样每个图像就会显示 1 秒或相隔多少秒。

我知道我可以使用插件，但我正在尝试学习 javascript，所以我想避免走捷径(当然除了在这里寻求帮助的捷径!)

谢谢

Answer 1

var img;
for(length)
{
  img[i]=new Image();
  img[i].src="src";
} 

//用于将图像存储为数组

var count=0;
var timerid = setInterval(function()
{
   //fade in image
   count++;
   if(count > length)clearInterval(timerId); 
}, 1000);

更好的选择是使用 display:none 标签将所有图像添加到 image.onload 上的 DOM，然后使用循环将图像一张一张淡入淡出，