Javascript прикрепить событие onclick ко всем ссылкам

Question

Я хочу прикрепить функцию к каждой ссылке на сайте, чтобы изменить параметр.

Как я могу сделать это без jQuery?

Как пройти по каждой ссылке (это может быть элемент DOM) и вызвать для них функцию?

Answer 1

Странно, что никто не предлагал альтернативное решение, которое использует всплывающее окно событий

function callback(e) {
    var e = window.e || e;

    if (e.target.tagName !== 'A')
        return;

    // Do something
}

if (document.addEventListener)
    document.addEventListener('click', callback, false);
else
    document.attachEvent('onclick', callback);

Плюсы этого решения в том, что когда вы динамически добавляете другой якорь, вам не нужно специально привязывать событие к нему, так что все ссылки всегда будут запускаться, даже если они были добавлены после выполнения этих строк.Это в отличие от всех других решений, опубликованных до сих пор.Это решение также более оптимально, если на вашей странице имеется большое количество ссылок.

Answer 2

getElementsByTagName поддерживается всеми современными браузерами и вплоть до IE 6

var elements = document.getElementsByTagName('a');
for(var i = 0, len = elements.length; i < len; i++) {
    elements[i].onclick = function () {
        // stuff
    }
}

Answer 3

function linkClickHandler(a) {
  console.log(a.host);
}

var links = document.getElementsByTagName('a');
for (var i = 0; i < links.length; i++) links[i].onclick = function() {
    linkClickHandler(links[i]);
}

Answer 4

лучше:

const item = document.querySelectorAll(".nav__item");

item.forEach(link => {
  link.addEventListener("click", function () {
    link.classList.add("nav__item--active");
  });
});

Answer 5

Что-то вроде этого должно быть полезно для вас:

var elements = document.getElementsByTagName("a"),
    i,
    len,
    el;

for (i = 0, len = elements.length; i < len; i++) {
    el = elements[i];

    // Do what you need on the element 'el'
}

Answer 6

Попробуйте использовать getElementsByTagName('a')