В данном уроке мы с вами изучим основы работы
с объектом Event
. Данный объект содержит
в себе информацию о произошедшем событии.
К примеру, если по элементу был сделан клик,
мы можем узнать координаты этого клика, была
ли нажата клавиша Ctrl
, Alt
или Shift
в момент клика и так далее.
Давайте посмотрим, как получить объект Event
.
Пусть у нас есть кнопка:
<button id="elem">text</button>
Пусть по клику на эту кнопку выполняется некоторая функция:
let elem = document.querySelector('#elem');
elem.addEventListener('click', function() {
});
Внутри привязанной функции уже есть объект
Event
- мы просто пока еще не знаем,
как его получить. Получается он следующем
образом: нужно при объявлении нашей функции
передать в нее параметром любую переменную
(как правило, event
- но название
может быть любым) и в эту переменную браузер
автоматически положит объект Event
:
elem.addEventListener('click', function(event) {
console.log(event); // увидим объект с событием
});
Самостоятельно проделайте описанные манипуляции и выведите объект с событием в консоль. Изучите структуру этого объекта.