javascript - 如果页面上存在链接，则在单击时添加类，javascript

Question

首先，我检查页面上是否存在带有价格类链接的按钮，然后我需要在点击时打开模式块。对于一个按钮它有效，但对于第二个按钮无效。你能帮忙看看缺少什么吗？

HTML：

<a class="prices__link" href="">Show more</a>
<br>
<a class="prices__link" href="">Button 2</a>
<div class="popup-business popup-business--hide">Modal</div>

JavaScript：

var popupPrices = document.querySelector('.popup-business');
var buttonPopupPricesOpen = document.querySelectorAll('.prices__link');
var buttonPopupPricesItem = document.querySelector('.prices__link');

if (buttonPopupPricesOpen.length !== 1) {

  buttonPopupPricesItem.addEventListener('click', function(evt) {
    evt.preventDefault();
    popupPrices.classList.toggle('popup-business--hide');
  });

  }

谢谢

标签： javascriptif-statement

Answer 1

也许你正在寻找的 javascript 是这样的：

const popupPrices = document.querySelector('.popup-business');
const buttonPopupPricesOpen = document.querySelectorAll('.prices__link');

// for each element with the class found, add an event
buttonPopupPricesOpen.forEach((buttonElem) => {
  buttonElem.addEventListener('click', function(evt) {
    evt.preventDefault();
    popupPrices.classList.toggle('popup-business--hide');
  });
});