javascript - 查看 id 是否等于可见或隐藏

Question

我不明白为什么当我在上面隐藏我的 Div 元素时这会通过我的 if 条件。我试图找出一种方法来编写如果 div id 等于可见然后提醒用户“内容可见”。如果我的 div id 等于 hidden 则提醒用户“content hidden”

//document.getElementById("myDiv").style.visibility = "visible";
document.getElementById("myDiv").style.visibility = "visible";

var status = document.getElementById("myDiv").style.visibility;


if($("#myDiv").is(":visible") == true){
    alert("visible JQuery");
}

if (document.getElementById("myDiv").style.visibility === "hidden")
{
   alert("visible JS");
}

alert(status);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<div id="myDiv">Hello</div>

Answer 1

Elements with visibility: hidden or opacity: 0 are considered visible, since they still consume space in the layout.

jQuery :visible

:visible 选择器仅适用于属性 display。

你可以做的是:

if ($("#myDiv").css("visibility") == "hidden") {
    // do something when hidden ...
}