Javascript 如何在需要时切换两个功能？香草冰淇淋ES5

我正在制作菜单，我需要添加child并将其从汉堡压力机上删除

使用toggle很容易添加/删除类，但是，在这里您将如何操作？香草冰淇淋ES5

// MAIN NAVIGATION MENU TOGGLE
var siteNav = document.querySelector(".site-nav"),
    siteHamburger = document.querySelector(".site-header__toggle-button"),
    overlayDiv  = document.createElement('div'),
    menuOverlay = document.createElement('div');
    menuOverlay.className = 'overlay';

function openMenu() {
    siteNav.classList.add('is-active');
    siteHamburger.classList.add('is-active');
    document.body.appendChild(menuOverlay);
}

function closeMenu() {
    document.body.removeChild(menuOverlay);
    siteNav.classList.remove("is-active");
    siteHamburger.classList.remove("is-active");
}



siteHamburger.addEventListener('click', openMenu, false);
siteHamburger.addEventListener('click', closeMenu, false);

---

添加切换功能，如：

function toggle() {

    if(siteNav.classList.contains("is-active")) {
        return closeMenu();
    }

    return openMenu();
}

而不是

siteHamburger.addEventListener('click', openMenu, false);
siteHamburger.addEventListener('click', closeMenu, false);

只需调用toggle函数

siteHamburger.addEventListener('click', toggle, false);

---

你的问题到底是什么？如何使用？我有两个功能，对吗？打开菜单和关闭菜单。如何在汉堡点击时切换它们？在第一次单击和第二次关闭菜单、第三次打开、第四次关闭、第五次等时切换打开菜单。我的回答解决了您的问题吗？请添加注释，否则请标记为已接受。您将如何使用附加来完成此操作？最困难的部分是当用户点击菜单时打开它，汉堡应该激活，菜单应该激活，我们应该添加并附加一个不透明度覆盖。当用户再次单击菜单时，所有这些都将消失，或者如果用户也单击覆盖，则可能会消失。但我在大部分情况下切换覆盖时遇到问题。@AurelianSpodarec创建了一个演示您的问题的示例。那么，如何切换到appendChild？如果单击汉堡菜单appendChild，下次单击时，removeChild，再次单击，appendChild，再次单击，removeChild，再次单击appendChild，再次单击removeChild，再次单击removeChild。你是怎么做到的？对不起，我误解了你写的代码是如何工作的。这管用！