请说明代码样式可见性的含义



美好的一天!我可以请问下面的代码是什么意思,尤其是有关(dialog.style.visibility =="可见")的部分?"隐藏":"可见";

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

CSS可见度

我对这种样式的理解是您可以隐藏某些东西,但是如果显示出来,它仍然会占用原本的空间。

其中 display: none本质上"删除"文档流中的元素,就像 position: absoulute一样。

阅读有关CSS视觉性样式的更多信息

三元运算符

var result = expression ? 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

在此处阅读更多有关javaScript中三元运算符的更多信息

此代码将用 divName的ID切换HTML元素的CSS可见性属性。

代码(dialog.style.visibility == "visible") ? "hidden" : "visible";使用条件运算符。

在您的上下文中,这与以下方式具有相同的效果:

if (dialog.style.visibility == "visible") {
    dialog.style.visibility = "hidden";
}
else {
     dialog.style.visibility = "visible;
}

如果对话框当前可见,则将其隐藏。在相反的情况下,如果目前不可见,它将显示。

被称为内联说话:http://noobflash.com/javascript-inline-if-statement/

可见性属性集或返回是否应可见元素。可见性属性允许显示或隐藏元素。它类似于显示属性。但是,不同之处在于,如果设置显示:没有,它隐藏了整个元素,而可见性:隐藏表示该元素的内容将是无形的,但是该元素停留在其原始位置和大小。

<。

最新更新