Html CSS背景图像以访问多个图像

我在forEach循环中创建一个div来保存图像（每个图像都有自己的div）。图像保存在单独的文件夹“介质”中。通过以下面代码中的方式设置背景图像的url，我可以访问单个图像，因此所有div都使用相同的图像填充

有没有办法通过url用单独的图像填充每个创建的div？创建的div数与媒体文件中的图像数相同

    $('.my-media').html('');
    media.forEach(function (mediaItem) {
      var div = $('<div>');
      $(div).addClass("class-a");
      $(div).addClass("class-b");
      $(div).css('background-image', 'url(media/0.jpg)');
      $(".my-media").append(div)
    });
  } 

$（'.my media'）.html（''）；
media.forEach（函数（mediateItem）{
var div=$（''）；
美元（div）.addClass（“a类”）；
美元（div）.addClass（“b类”）；
$（div.css（'background-image'，'url（media/0.jpg）'）；
$（“.my media”）.append（div）
});
} 

**更新-我已将代码更改为：

    $('.my-media').html('');
    media.forEach(function (mediaItem) {
      var div = $('<div>');
      $(div).addClass("class-a");
      $(div).addClass("class-b");
      for (let i=0; i < mediaItemIndex.length; i++){
        $(div).css('background-image', `url('media/${mediaItemIndex[i]}.jpg')`); 
      }

      $(".my-media").append(div)
    });
  } 

where 
``` var mediaItemIndex = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9',
    '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24']

$（'.my media'）.html（''）；
media.forEach（函数（mediateItem）{
var div=$（''）；
美元（div）.addClass（“a类”）；
美元（div）.addClass（“b类”）；
for（设i=0；i

但现在只显示所有div的最终图像。再次感谢所有的帮助/建议

最后更新：我已经解决了这个问题。 图像的路径文件存储在“媒体url”下的对象数组中。通过使用

.replace（“../”，“”）

，我摆脱了文件路径中不必要的部分，可以访问图像

我最初尝试访问图像的方式失败了，因为它在一个循环中创建了一个循环。forEach循环已经在图像中循环，所以当我使用

for（让I=0；…

时，我创建了一个只显示最终图像的无限循环

替换此行

$（div.css（'background-image'，'url（media/0.jpg）；

用我第一次编辑的这一行

$（div.css（'background-image'，'url（${mediaItem.media\u url.replace（../“，”“）}）`）；

意味着每个图像只显示一次，即问题已解决

---

谢谢大家的建议！

如果我没听错的话，给你

$('.my-media').html('');
media.forEach(function (mediaItem, mediaItemIndex) {
  var div = $('<div>');
  $(div).addClass("class-a");
  $(div).addClass("class-b");
  $(div).css('background-image', `url(media/${mediaItemIndex}.jpg)`);
  $(".my-media").append(div)
});

$（'.my media'）.html（''）；
media.forEach（函数（mediaItem、mediaItemIndex）{
var div=$（''）；
美元（div）.addClass（“a类”）；
美元（div）.addClass（“b类”）；
$（div.css（'background-image'，'url（media/${mediatementindex}.jpg）`）；
$（“.my media”）.append（div）
});

JS如何知道图像的URL应该是什么？这就是

mediaItem

值所包含的内容吗？您是要求JS能够读取文件目录，还是知道这些文件从0.jpg、1.jpg一直到n.jpg，其中n+1是已经创建的div数，还是要创建的div数？@Rorymcrossan老实说，我不知道。这是一个main.js文件的片段，作为使用API的项目的一部分，我必须重建它。我是一个真正的新手，所以请原谅我拙劣的行话。mediaItem在其他地方作为函数参数传递，但从未定义。基于它在其他地方的使用方式，它似乎是指al图像文件，但又一次，它没有在任何地方定义。@AHaworth这些文件按时间顺序从0.jpg到24.jpg命名。div是在设置url路径的同一个函数中创建的。再次，如果我的术语不太好，我表示歉意，我对这很陌生。媒体定义在哪里？你从什么HTML开始？谢谢你的回答！我有我试图实现这一点，但我正在努力。据我所知，我必须编写另一个函数，遍历图像文件名列表并指定一个索引值，然后我可以将该值指定给mediaItemIndex。由于图像文件位于单独的文件夹中，我知道我还必须在某个位置包含文件路径，但我无法执行此操作让我们把这些部分连接起来。我将再次非常感谢您的建议！