Различные рандомизированные фоновые изображения для нескольких divs

Question

Как бы я мог чередовать фон со случайными изображениями каждого div с аналогичными свойствами с помощью javascript? (Не все дивы должны быть тем же образом, хотя и может быть перекрывается, если пул изображение мал)

У меня есть несколько дивов с теми же свойствами, в моем случае:

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

У меня также есть папка (изображения /), который obj1.jpg, obj2.jpg ... obj5.jpg

до сих пор у меня есть яваскрипт код:

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 имел рандомизированное изображение?

Спасибо в продвижении.

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), а затем пройдите через каждый из возвращенных предметов.

Кроме того, как отмечают другие люди, идентификатор должен быть уникальным. Если вы хотите иметь несколько div с тем же свойством, вы должны использовать соответствующие классы.