Question

如何使用javascript将背景与具有相似属性的每个div的随机图像交替进行？（并非所有div都应该是相同的图像，但如果图像池很小则可能存在重叠）

我有多个具有相同属性的div，在我的情况下：

<div class="background" id="bgimg"></div>

我还有一个文件夹（images /），有obj1.jpg，obj2.jpg ... obj5.jpg

到目前为止，我有一个javascript代码：

function bckg(){
            var images = ['obj1.jpg', 'obj2.jpg', 'obj3.jpg', 'obj4.jpg', 'obj5.jpg'];
            var div = document.querySelector('#bgimg');
            div.style.backgroundImage = 'url(images/' + images[Math.floor(Math.random() * images.length)] + ')';
            }

然而，并非所有div都以随机图像结束。相反，只有第一个div显示随机图像。

我如何让每个div都有一个随机图像？

先谢谢。

Answer 1

document.querySelector仅选择第一项。（https://developer.mozilla.org/en-US/docs/Web/API/document.querySelector）

尝试document.querySelectorAll（https://developer.mozilla.org/en-US/docs/Web/API/Document.querySelectorAll），然后循环浏览返回的每个项目。

此外，正如其他人所提到的，ID应该是唯一的。如果你想拥有多个具有相同属性的div，你应该使用匹配的类。

多个div的不同随机背景图像

1 个答案: