javascript - 如何将一个或多个变量附加到一个事件监听器？

Question

我在 if 语句内有一个事件监听器，用于滑入菜单。

const burger = document.querySelector(".c-brgr");

if (!menuOpen) {
    burger.addEventListener('click', function () {
      if (!menuOpen) {
        nav.classList.add("menu-is-open");
        menuOpen = true;
      } else {
        nav.classList.remove("menu-is-open");
        menuOpen = false;
      }
   });
}

我在 HTML 中还有一个 div，单击它时也可以关闭菜单。我可以再做一个。

const closeArea = document.querySelector(".js-close-area");

if (!menuOpen) {
    closeArea.addEventListener('click', function () {
      if (!menuOpen) {
       // as above
      } else {
       // "
      }
   });
}

这一次，我没有使用汉堡，而是使用了其他元素。 关闭区域。然而，这将不必要地重复代码。

有没有一种方法可以为两个 addEventListeners 使用一个 if 语句？

Answer 1

是的，您可以将两者添加到数组中，然后按如下方式循环遍历它们

    const burger = document.querySelector(".c-brgr");
    const closeArea = document.querySelector(".js-close-area");

    if (!menuOpen) {
        [burger, closeArea].forEach(element => {
          element.addEventListener('click', function () {
             if (!menuOpen) {
               // as above
              } else {
                // "
              }
           });
        }
    }