@alekamisleforma

Как обрабатывать клик по любой ссылке?

Мне нужно, чтобы при клике на любую ссылку отрабатывалась функция. Попытался сделать так, но не работает.
document.getElementsByTagName('a').onclick = function() {}

Возможно дело в том, что, если я правильно понял, getElementsByTagName возвращает массив всех, в моем случае, ссылок. Подскажите, как правильно?
  • Вопрос задан
  • 240 просмотров
Решения вопроса 1
FinGanapre
@FinGanapre
Конкретно ваш код не отрабатывает, т.к. к вам приходит псевдо-массив (NodeList) всех элементов a в документе. Вы могли бы пройтись по нему циклом и повесить на каждый элемент обработчик, но так делать не нужно. Во-первых, вы заставляете браузер искать все a на странице, во-вторых - вешаете обработчик на каждую. При этом, делаете это через цикл.

Так как по умолчанию все события всплывают (это поведение можно изменить, а также отменить всплытие события на элементе), т.е. клик на вложенный элемент можно поймать в родительском, лучше вешать все обработчики на документ.

// вешаем обработчик на документ
// если повесите на каждую ссылку - то кол-во обработчиков будет равно кол-ву ссылок
// так себе идея
document.addEventListener('click', e => {
  // определяем, что клик произошёл на ссылке
  if (e.target.nodeName === 'A') {
    // отменяем переход по ссылке
    e.preventDefault()
    console.log('do some there')
  }
})


getElementsByTagName - не стоит использовать. Сейчас прекрасно работают querySelector и querySelectorAll. Из старых способов получения элементов можете пользоваться разве что getElementById, т.к. он отработает чуть быстрее
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы