В 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 позволяет обрабатывать все виды событий, таких как нажатие клавиши, наведение курсора мыши, отправка и многое другое. Процесс подключения прослушивателей событий и обработки событий одинаков для разных типов событий. Вам просто нужно изменить тип события и, возможно, элемент, на который вы ориентируетесь, в зависимости от того, что вы пытаетесь сделать.