在 vanilla JavaScript 上缓慢添加类

Question

我在移动设备上有移动菜单和目录部分。 它通过添加删除类在带有普通 JavaScript 的移动设备上显示，但显示隐藏菜单大约需要一秒钟。 我要它立即打开。 我的 JavaScript 有什么问题？

网站： https ://www.dentistryturkey.com/dentist-dental-clinic.html

function myFunction() {
        var x = document.getElementById("myTopnav");
        if (x.className === "topnav") {
            x.className += " responsive";
        } else {
            x.className = "topnav";
        }
    }

Answer 1

缓存元素：

const topNav = document.getElementById('myTopnav');

使用事件监听器：

<a href="#" class="icon" id="menu"><small>MENU</small> </a>

脚本：

document.getElementById('menu').addEventListener('click', e => { 
  e.preventDefault(); // stop the click
  topNav.classList.toggle('responsive')
});