Введение
Добро пожаловать в документацию по JavaScript! В этом практическом занятии вы познакомитесь с событиями.
События
В ВМ уже предоставлен
index.html.
Реальная интерактивность на веб-сайте требует обработчиков событий. Это структуры кода, которые слушают активность в браузере и выполняют код в ответ. Наиболее очевидный пример - это обработка события клика, которое срабатывает в браузере при нажатии на что-то мышью. Чтобы продемонстрировать это, введите следующее в консоль, а затем кликните по текущей веб-странице:
document.querySelector("html").addEventListener("click", function () {
alert("Ouch! Stop poking me!");
});
Есть несколько способов прикрепить обработчик событий к элементу.
Здесь мы выбираем элемент <html>. Затем мы вызываем его функцию addEventListener(), передав имя события для прослушивания ('click') и функцию для выполнения при наступлении события.
Функция, которую мы только что передали в addEventListener() здесь, называется анонимной функцией, потому что у нее нет имени. Есть альтернативный способ записи анонимных функций, который мы называем стрелочной функцией.
Стрелочная функция использует () => вместо function ():
document.querySelector("html").addEventListener("click", () => {
alert("Ouch! Stop poking me!");
});
Пожалуйста, нажмите на кнопку 'Go Live' в нижнем правом углу, чтобы запустить веб-сервис на порту 8080. Затем можно обновить вкладку Web 8080, чтобы просмотреть веб-страницу.
Резюме
Поздравляем! Вы завершили практическое занятие по событиям. Вы можете выполнить больше практических занятий в LabEx, чтобы улучшить свои навыки.