JavaScript: назначить уникальный идентификатор элементам, содержащим определенный класс

Question

Итак, у меня есть этот HTML код:

  <p style="margin-bottom: 5px"><span id="" class="stars-container stars-custom">★★★★★</span></p>

В основном я хочу назначить уникальный идентификатор каждому экземпляру этого элемента, поэтому первый элемент id="1", второй элемент id="2" et c.

Я думал об использовании getElementsByClassName для их идентификации и захвата имени класса, но как мне назначить и уникальный идентификатор ?? Я довольно новичок в JS, поэтому я не понимаю, как будет выглядеть l oop.

Answer 1

Это справится. Вы в основном выбираете все элементы p с указанными вами классами, l oop над ними и устанавливаете id для каждого из них в индекс переменной l oop.

Я не мог используйте foreach l oop, так как он не используется на HTMLCollections

const paragraphs = document.getElementsByClassName('stars-container stars-custom');

for (let i = 0; i < paragraphs.length; i++) paragraphs[i].setAttribute('id', i + 1);