как узнать на какой элемент нажали js
JavaScript | На каком HTML-элементе был клик?
Как получить объект HTML-элемента по которому был совершён клик в документе?
Идея в том, что мы не знаем на какой HTML-элемент может нажать пользователь. Представьте, что у вас на странице есть элементы пагинации — кнопки с цифрами. Вы хотите отловить ту самую кнопку по которой кликнул пользователь, чтобы отрисовать ему нужное содержимое. Индекс кнопки будет участвовать в алгоритме отображения. Как быть?
Решение
Мы повесили слушатель события на весь документ. То есть метод addEventListener() был вызван у объекта document. Это максимально расширяет наши возможности в отлове любого элемента из HTML-разметки. Первым параметром мы указали тип события, который мы хотим отловить(услышать) — это « click «. Вторым параметром мы передали функцию-обработчик, которая выполнится только при совершении события клика на документе. Это функция обратного вызова т. е. callback. Функция-обработчик сработает только в момент свершения события. Мы просто её передали, а не вызвали. Для простоты восприятия функция оформлена в виде стрелочной.
В этом решении мы просто выводим в консоль цель события (нужный нам «кликнутый» элемент), но мы уже можем начать взаимодействие с элементом без вывода в консоль.
Пример простейшего взаимодействия с «кликнутым» элементом
Например мы можем менять внутреннее содержимое «кликнутого» элемента, если оно есть.
Откройте любую страницу любого сайта. Введите в консоль эту команду и покликайте на текстовые элементы страницы (не ссылки). Будет весело!