CSS样式不使用JavaScript还原

我试图根据CSS属性的值，使用JavaScript前后设置CSS属性

类名

菜单

设置为在页面加载时隐藏。当我调用函数将其设置为可见时，它是成功的。但是，当我再次调用它以将其更改回时，它不会将其设置为隐藏。它被视为始终设置为可见

let menu = document.querySelector('.menu');
if (menu.style.visibility = 'hidden') {
  menu.style.visibility = 'visible';
  console.log('visible'); // always shows this.
} else {
  menu.style.visibility = 'hidden';
  console.log('hidden'); // doesn't get to here when .menu is visible.
}

我不明白为什么它能做第一件事而不能做第二件事。我已尝试使用

else if

条件：

else if (menu.style.visibility = 'visible')

我也尝试过使用

setAttribute

方法，但结果总是一样的

---

我需要能够来回切换。

请使用以下条件

if (menu.style.visibility == 'hidden') //change ==

---

你的条件无效。实际上，您正在if语句中设置值

if (menu.style.visibility = 'hidden') // this sets the value

应该是这样的：

if (menu.style.visibility == 'hidden') // this compares the value

---

您用于比较的语法错误您需要在比较javascript中的任何字段时使用

=

，因此只需执行以下操作：

if (menu.style.visibility == 'hidden') {
  menu.style.visibility = 'visible';
  console.log('visible'); // always shows this.
} else {
menu.style.visibility == 'hidden';
console.log('hidden'); // doesn't get to here when .menu is visible.
}

---

在JavaScript中，通过使用

=

为某个对象赋值，但如果使用

=

则检查某个对象是否等于其他对象

let menu=document.querySelector（'.menu'）；
如果（menu.style.visibility==“hidden”）{
menu.style.visibility='visible'；
console.log（'visible'）；//始终显示此信息。
}否则{
menu.style.visibility='hidden'；
console.log（'hidden'）；//在.menu可见时无法到达此处。
}

错误在if语句中。因此，如果将单等号更改为双等号：

==

，则代码应该可以工作：

比如：

---

此代码将切换页面上div的可见性

函数togglediv（）{
var div=document.getElementById（“菜单”）；
div.style.display=div.style.display==“无”？“块”：“无”；
}

切换div
div

为什么不使用jQuery？代码的问题是，在条件中使用了一个等号。这并不检查可见性是否等于“visible”，而是将字符串“visible”指定给可见性（或至少尝试指定）。使用两个或三个等号作为条件来检查相等性。三个等号是首选方式。如果解决了您的问题，请将其标记为答案

if (menu.style.visibility == 'hidden')