- Теория
- Теория
Кекстаграм: знакомимся с циклом
Если нужно совершить несколько однотипных действий, то можно использовать
цикл for
. Вот его синтаксис:
for (var num = 0; num <= 5; num++) {
console.log(num);
}
// Выведет в «консоль» числа 0, 1, 2, 3, 4 и 5
О циклах подробно рассказывается в части «Циклы».
Ранее мы использовали метод querySelector
, который возвращает только один элемент: первый элемент,
соответствующий селектору. Другой метод querySelectorAll
возвращает все элементы, соответствующие селектору. Подробно об этом методе рассказывается в части «Знакомство с Javascript в браузере».
С помощью for
удобно перебирать найденные элементы:
var controls = document.querySelectorAll('.toggle-controls button');
for (var i = 0; i < controls.length; i++) {
controls[i].innerHTML = 'переключатель';
}
// Во все элементы списка переключателей запишется строка «переключатель».
В Кекстаграме может быть много фильтров, количество и названия которых мы можем не знать. Поэтому нельзя искать каждый переключатель по его классу и задавать его название.
Лучше найти все переключатели внутри списка и перебрать их с помощью цикла. И внутри цикла задавать название каждому переключателю.
- index.html
Вы перешли на другую страницу
Кликните внутри мини-браузера, чтобы поставить фокус в это окно.