TGViewer
Точка входа в программирование Точка входа в программирование @prog_point · 18K subscribers
Post #5167 454
Собираем счётчик кликов на JavaScript

Счётчик с одной кнопкой помогает увидеть базовый цикл интерактивной страницы: браузер замечает нажатие, программа меняет число в переменной и выводит новое значение на экран.

В пошаговой сборке счётчика вы создадите файлы index.html и script.js, найдёте кнопку и число по их id, подключите функцию к событию клика через addEventListener и обновите текст с помощью textContent.

Разбор также поможет найти типичные ошибки: несовпадающие id, слишком ранний запуск скрипта и переменную счётчика внутри обработчика. В последнем случае каждый клик показывает 1, потому что значение каждый раз создаётся заново. После запуска попробуйте добавить кнопки уменьшения и сброса: так станет понятнее, как одно состояние связывается с несколькими действиями.
  • ❤ 2
  • 😐 1
More from @prog_point
  1. Oct 8, 2026Практика HTML и CSS: карточка товара и адаптивная галерея Соберите карточку с изображением…
  2. Oct 8, 2026Как начать отладку Python-кода в PyCharm Вместо очередного print() можно приостановить про…
  3. Oct 7, 2026Меньше работы для браузера: content-visibility на длинных страницах Карточки далеко за пре…
  4. Oct 7, 2026Как собрать счётчик слов на HTML, CSS и JavaScript Сделайте страницу, которая пересчитывае…
  5. Oct 6, 2026Соберите кнопку и карточку с CSS-градиентами Начните с двух небольших элементов: задайте к…
  6. Oct 4, 2026Как собрать интерактивную карту Leaflet со своими метками Для первой карты не нужен сложны…
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →