Почему идет ошибка like.addEventListener is not a function?

195
30 января 2019, 02:30

Есть такой код и он работает:

function openLikeBlock() {
  var like = document.getElementById("like");
  like.addEventListener('click', function (e) {
    e.preventDefault();
    if (!this.classList.contains('open'))
      this.classList.add('open');
    else
      this.classList.remove('open');
  });
}

Но если добавить ClassName то будет ошибка:

var like = document.getElementsByClassName("like");

Uncaught TypeError: like.addEventListener is not a function

Мне нужно именно класс, так как таких блоков несколько на странице (поэтому использую this)

Вопрос: как сделать, что бы я мог получать элемент по классу, а не ID?

Answer 1

Потому что getElementsByClassName возвращает коллекцию элементов, а у коллекции нет метода addEventListener

для решение можно просто пробежаться по возвращенной коллекции. например так:

[].forEach.call(like,function(el){
    el.addEventListener('click', function (e) {...})
});
READ ALSO
Не работает событие click в safari

Не работает событие click в safari

Не могу понятьВо всех браузерах работает

213
Чем отличается addEventListener от onclick?

Чем отличается addEventListener от onclick?

чем отличается addEventListener от onclick ?

187