javascript - 如何通过 querySelectorAll() 选择所有元素

Question

我有一个带有产品目录的网站 https://www.estelab.ru/cosmetics/zo-medical/

单击橙色背景中的“购买”按钮后，您可以在控制台消息中看到（“addToCart works”）

但是这个点击适用于第一个按钮。

var CartButton = document.querySelector(".eshop_js-add-to-cart");
CartButton.onclick = (function() {
  console.log("addToCart works");

});

标签： javascript

Answer 1

你应该使用 forEach

var CartButton = document.querySelectorAll(".eshop_js-add-to-cart");

CartButton.forEach((item) => {
  item.onclick = function () {
    console.log("addToCart works");
  };
});

<div class="eshop_js-add-to-cart">Click me!</div>
<div class="eshop_js-add-to-cart">Click me!</div>
<div class="eshop_js-add-to-cart">Click me!</div>
<div class="eshop_js-add-to-cart">Click me!</div>