Javascript 我的汉堡图标未显示导航菜单

我的汉堡店没有显示导航菜单

我试图通过改变JS中的函数和我的操作方式来解决这个问题，但当您将页面大小减小到812px或更小（媒体查询）时，仍然无法显示菜单

HTML

CSS

@媒体屏幕和（最大宽度：812px）{
ul.aw-navigation{
可见性：隐藏；
}
#导航级{
显示器：flex；
弯曲方向：立柱；
}
/*汉堡菜单*/
.汉堡{
显示：内联块；
光标：指针；
}
.bar1、.bar2、.bar3{
宽度：20px；
高度：2倍；
背景色：#333；
利润率：6px0；
过渡：0.4s；
}
.找零{
-webkit变换：旋转（-45度）平移（-4px，3px）；
变换：旋转（-45度）平移（-4px，3px）；
}
.change.bar2{opacity:0；}
.找零{
-webkit变换：旋转（45度）平移（-8px，-8px）；
变换：旋转（45度）平移（-8px，-8px）；
}
}

JS

//汉堡//
函数myFunction（x）{
x、 切换（“更改”）；
}
函数toggleDropdown（）{
document.getElementById（“导航类”）.classList.toggle（“显示”）；
}
window.onclick=函数（事件）{
如果（！event.target.matches（'.burger'））{
var dropdowns=document.getElementById（“nav类”）；
var i；
对于（i=0；i

控制台中不显示任何错误

myFunction（）将汉堡图标更改为X图标仍在工作，而toggleDropdown（）不起作用

提前谢谢

1-

标记未关闭。 2-增加课堂表演。 3-document.getElementByID始终返回一个参数，因此不能用于循环。

1-

标记未关闭。 2-增加课堂表演。

---

3-document.getElementByID始终返回一个参数，因此不能用于循环。

我想您忘记了CSS代码中的show类

.show ul.aw-navigation{
visibility: visible;

}

这是我试过的密码笔

---

你可以在w3schools或codepen上找到更吸引人的导航标签汉堡菜单实现，只需通过谷歌搜索

我想你忘记了CSS代码中的show类

.show ul.aw-navigation{
visibility: visible;

}

这是我试过的密码笔

---

您可以在w3schools或codepen上找到更具吸引力的导航标签汉堡菜单实现，只需通过谷歌搜索

导航类没有CSS。show-当切换

show

类时，您预计会发生什么？顺便问一句，

var dropdowns=document.getElementById（“导航类”）

返回单个元素，而不是它们的列表。

#nav class.show

-当切换

show

class时，您希望发生什么？顺便问一下，

var dropdowns=document.getElementById（“nav class”）返回单个元素，而不是它们的列表。