как присвоить класс к рандомным элементам

Question

<div id=“blocks”>
    <div class=“block”></div>
    <div class=“block”></div>
    <div class=“block”></div>
    <div class=“block”></div>
    <div class=“block”></div>
    <div class=“block”></div>
    <div class=“block”></div>
</div>

нужно рандомно выбрать 3-4 элемента и присвоить им класс active, написать на чистом JS, не на Jquery

Answer 1

let toSelect = 3;
const blocks = document.getElementById('blocks').children;
const used = [];

while (toSelect !== 0) {
  const index = Math.floor(Math.random() * blocks.length);

  if (used.lenght === blocks.length) break;
  if (used.includes(index)) continue;

  blocks[index].classList.add('active');
  used.push(index);
  toSelect--;
}

.block {
  height: 50px;
  width: 50px;
  background: #ddd;
}

#blocks {
  display: flex;
  flex-wrap: wrap;
}

.active {
  background: red;
}

<div id="blocks">
  <div class="block"></div>
  <div class="block"></div>
  <div class="block"></div>
  <div class="block"></div>
  <div class="block"></div>
  <div class="block"></div>
  <div class="block"></div>
  <div class="block"></div>
</div>

БЛОГ НА HUSL

как присвоить класс к рандомным элементам

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