Урок 14 · JavaScript

Один обработчик — одно понятное действие

addEventListener слушает событие. Для кнопки это click, и функция обработки должна быть короткой.

Почему это следующий шаг

Текст уже меняется из консоли. Теперь это делает человек щелчком.

Как сделать

Повесь обработчик на button type="button", если кнопка не отправляет форму. Внутри вызови обычную функцию, а не пиши всю программу в стрелке на сорок строк. Повторный щелчок должен быть предсказуемым: счётчик растёт, переключатель возвращается назад. Не вешай второй такой же обработчик при каждом клике.

const button = document.querySelector("#next");
let step = 1;
button.addEventListener("click", () => {
  step += 1;
  button.textContent = `Шаг ${step}`;
});

Что проверить

• Кнопка — это button, а не div.
• Один клик меняет состояние один раз.
• В консоли нет новой ошибки.