Question

我无法找到以下代码无效的原因：

var nav = document.getElementById("nav").style.visibility;
if (nav === "" || nav === "hidden")
    nav = "visible";
else
    nav = "hidden";

有人可以解释为什么我不能在if..else中更改nav吗？

Answer 1

因为您只是为变量赋值而不是更新该元素。

var nav = document.getElementById("nav");
var visibility = nav.style.visibility;

if (visibility === "" || visibility === "hidden")
  nav.style.visibility = "visible";
else
  nav.style.visibility = "hidden";

Answer 2

考虑一下

if (visibility === "" || visibility === "hidden")
  document.getElementById("nav").style.visibility = "visible";
else
  document.getElementById("nav").style.visibility = "hidden";

首先在代码中布局逻辑，以及您希望它的工作方式。似乎很清楚这段代码是关于什么的。至少它应该给自己！完成后，您可以将稍后在程序中可能需要的内容分解出来。例如，如果您要更改元素的可见性，则需要将其提取到外部范围。

var element_style = document.getElementById("nav").style;
if (visibility === "" || visibility === "hidden")
  element_style.visibility = "visible";
else
  element_style.visibility = "hidden";

在那里，您必须忽略.visibility中的element_style因为那时（在if区块中）您通过.访问对象的属性运算符和赋值=并将其分配给字符串值。这意味着您的nav被分配给值为“可见或隐藏”的新字符串，并且您完全分离了您想要更改的对象（nav元素）。

在您的代码中，您可以记录nav以查看您要确认的内容。

无法在if / else中更改变量

2 个答案: