В данном уроке мы с вами изучим основы работы с объектом 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); // увидим объект с событием
});
Самостоятельно проделайте описанные манипуляции и выведите объект с событием в консоль. Изучите структуру этого объекта.