Как с помощью js перебирать объекты на странице, и менять для них стиль

Question

Допустим у меня на странице 10 или 50 или 800 объектов(одинаковых), не принципиально, и вот мне нужно с помощью js перебрать их всех и каждому из них задать рандомный background, рандомный цвет получать я могу, но мне нужно перебрать все объекты на странице и задать каждому свой цвет.

Подскажите пожалуйста)

Answer 1

Но можно так

const colors = ['red', 'green', 'blue'];
let elements = [...document.querySelectorAll('.d')];

elements.forEach(elem => {
  elem.style.backgroundColor = colors[Math.floor(Math.random() * colors.length)];
});

.d {
display: block;
width: 50px;
height: 30px;
}

<div class="d">DIV</div>
<div class="d">DIV</div>
<div class="d">DIV</div>
<div class="d">DIV</div>
<div class="d">DIV</div>
<div class="d">DIV</div>

Answer 2

Или можно так.

const colors = ['red', 'green', 'blue'];
let elements = [...document.querySelectorAll('.d')];

const getRandomInt = (max) => Math.round(Math.random() * max);

elements.forEach(elem => {
  elem.style.backgroundColor = `rgb(${getRandomInt(255)},${getRandomInt(255)},${getRandomInt(255)},${getRandomInt(255)})`;
});

.d {
  display: block;
  width: 50px;
  height: 30px;
}

<div class="d">DIV</div>
<div class="d">DIV</div>
<div class="d">DIV</div>
<div class="d">DIV</div>
<div class="d">DIV</div>
<div class="d">DIV</div>

БЛОГ НА HUSL

Как с помощью js перебирать объекты на странице, и менять для них стиль

Ответы (2 шт):