Итерация по выделенным элементам

Краткое описание: в этом уроке вы узнаете, как выполнять итерации по выбранным элементам с помощью метода forEach() и цикла for-loop.

После выбора элементов с помощью querySelectorAll() или getElementsByTagName(), вы получите коллекцию элементов в виде NodeList.

Для перебора выбранных элементов вы можете использовать метод forEach() (поддерживается большинством современных браузеров, но не IE) или просто использовать старый добрый цикл for.

Использование метода forEach()

Следующий код выбирает все элементы, чей CSS-класс .note, и меняет цвет фона на желтый:

const notes = document.querySelectorAll('.note'); notes.forEach((note) => { note.style.backgroundColor = 'yellow'; });
Code language: JavaScript (javascript)

В качестве альтернативы можно использовать метод forEach() объекта Array следующим образом:

[].forEach.call(notes, (note) => { note.style.backgroundColor = "yellow"; });
Code language: PHP (php)

Использование цикла for

Следующий код использует цикл for для перебора выбранных элементов:

const notes = document.querySelectorAll('.note'); const count = notes.length; for (let i = 0; i < count; i++) { notes[i].style.backgroundColor = "yellow"; }
Code language: JavaScript (javascript)

Оцените статью
devanswers.ru
Добавить комментарий