В JavaScript событие похоже на то, что происходит на веб-странице. Это может быть, когда вы нажимаете кнопку, перемещаете мышь, когда страница завершает загрузку, или когда таймер достигает определенного времени.
Обработчик события
Чтобы что-то происходило при возникновении события, вы должны добавить обработчик события. Это фрагмент кода, который выполняется, когда происходит событие.
// Hey, let's grab a reference to that awesome button element const button = document.getElementById('myButton'); // Now, prepare yourself for the mind-blowing event handling function! function handleClick() { console.log('Button clicked! Whoa, mind blown!'); } // It's showtime, my friend! Let's attach the event listener to the button button.addEventListener('click', handleClick);
В приведенном выше примере мы начинаем с получения ссылки на элемент кнопки с идентификатором myButton
с помощью метода getElementById
. Затем мы определяем функцию с именем handleClick
, которая будет выполнять свою работу при нажатии кнопки. В этом случае он просто выводит сообщение на консоль.
Наконец, мы прикрепляем прослушиватель событий к кнопке с помощью метода addEventListener
. Первый аргумент — это тип события, в данном случае «щелчок», а второй аргумент — это функция handleClick
, которая будет вызываться при нажатии кнопки.
Когда вы действительно нажмете эту кнопку, функция handleClick
начнет действовать, и вуаля! Вы увидите сообщение «Кнопка нажата!» отображается в консоли.
Этот пример — лишь верхушка айсберга, друг мой. JavaScript позволяет обрабатывать все виды событий, таких как нажатие клавиши, наведение курсора мыши, отправка и многое другое. Процесс подключения прослушивателей событий и обработки событий одинаков для разных типов событий. Вам просто нужно изменить тип события и, возможно, элемент, на который вы ориентируетесь, в зависимости от того, что вы пытаетесь сделать.