javascript - 如何加载要褪色的图像数组？

Question

我有以下代码，其中仅加载一张图像。但我想从 e 文件夹加载多个图像，然后将它们淡入和淡出。但我感兴趣的是，如何从文件夹加载所有图像而不重复代码，如 src="frames/frame_1"src="frames/frame_2"我想要像 src="frames/frame_"这样软的东西+ i + ".jpg"其中 i 是帧的编号

这就是我现在只加载一张图像的方式

var img = new Image();
var div = document.getElementById('foo');

img.onload = function() {
  div.appendChild(img);
};

img.src = 'frames/frame_1.jpg';

Answer 1

相对简单。您基本上将已有的代码放入循环中:

var img, i,
    imageCount = 5,
    div = document.getElementById('foo');

for(i = 0; i < imageCount; i++){
    img = new Image();
    img.onload = function() {
        div.appendChild(img);
    };
    img.src = 'frames/frame_' + i + '.jpg';
}