addEventListener "click" не отвечает в файле ejs

Question

header.ejs

footer.ejs

delicacies.ejs

cart.js

Я пытаюсь заставить элемент ("span.cartcount") отображаться так, как он настроен для отображения: ни один вCSS файлОн должен отображаться, когда я нажимаю на кнопку addtocart (a.addtocartbutton).

Я также буду рад, если мне удастся узнать направления или альтернативный способ использования системы корзины покупок с помощью express.js

Спасибо.

Answer 1

document.querySelector() возвращает только первый элемент, соответствующий селектору.У вас есть цикл foreach(), который создает несколько элементов, вам нужно добавить прослушиватель событий для всех них.Поэтому вам нужно использовать document.querySelectorAll() и перебирать их.

let addToCartButtons = document.querySelectorAll("a.addtocartbutton");
let cartCount = document.querySelector("span.cartcount");

addToCartButtons.forEach(btn => btn.addEventListener("click", (event) => {
    event.preventDefault();
    cartCount.style.display = "inline";
}));