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

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时，我还要在HTML中有一个div，以同时关闭菜单。我可以再做一个。

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

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

这次，我使用其他元素代替汉堡。closeArea。但是，这将不必要地重复代码。

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

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 {
                // "
              }
           });
        }
    }