javascript - 请解释一下代码风格可见性的含义

Question

美好的一天!请问下面的代码是什么意思，特别是关于 (dialog.style.visibility == "visible") 的部分？ “隐藏”:“可见”；

dialog = document.getElementById("divName");
dialog.style.visibility = (dialog.style.visibility == "visible") ? "hidden" : "visible";

Answer 1

CSS 可见性

我对这种风格的理解是，你可以隐藏某些东西，但它仍然会占用原本显示的空间。

其中 display: none 本质上是从文档流中“删除”元素，就像 position: Absolute 所做的那样。

Read more about the CSS visility style

三元运算符

var 结果 = 表达式 ? thisIfTrue : elseThisIfFalse

dialog = document.getElementById("divName");
dialog.style.visibility = 
                  (dialog.style.visibility == "visible") ? "hidden" : "visible";

上面的代码使用了三元语句:

// If visibility is equal to 'visible' visible
dialog.style.visibility == "visible" 
            ? "hidden"    // then set it to hidden, 
            : "visible";  // otherwise set it to visible

Read more more about the ternary operator in javascript here