- Теория
- Теория
Кекстаграм: программируем переключатели, часть 2
Мы добавили обработку клика для одного переключателя. Не забываем, что переключателей может быть много, их количество и названия наперёд мы знать не можем.
Поэтому, чтобы обрабатывать щелчки по всем переключателям, лучше воспользоваться циклом. Тем более, что цикл по всем переключателям у нас уже есть.
А чтобы сократить код в цикле, создадим новую функцию:
function clickControl(control) {
control.addEventListener('click', function() {
toggleFilter(control.dataset.filter);
});
};
Функция clickControl
принимает найденный элемент и добавляет ему обработчик щелчков мыши, в котором
вызывается функция переключения фильтра. Название фильтра для функции переключения берётся из data-атрибута самого
элемента.
Благодаря clickControl
нам нужно добавить только одну строчку в цикл, чтобы все переключатели
заработали:
for (var i = 0; i < controls.length; i++) {
...
clickControl(controls[i]);
}
- index.html
Вы перешли на другую страницу
Кликните внутри мини-браузера, чтобы поставить фокус в это окно.