javascript - .is ("visible") & .is (":visible") 工作方式不同

Question

我正在使用 jquery 可见选择器来检查子元素是否可见。但令人惊讶的是 .is("visible") 和 .is(":visible") 在使用 css Visibility:hidden 时显示不同的结果当我使用 .is('visible') 时，它会发出 false 警报，而使用 .is(":visible") 时，它会发出 true 警报。但是将css属性更改为display:none时，结果是一致的。代码如下。

HTML

<div id="parentEle">
    I have hidden span
    <span class="hiddenContent">
        I am hiddenContent
    </span>
</div>
<button type="button" onclick="_checkChild()">Check Child</button>

JS

function _checkChild(){
    var x= false;
    x =$("#parentEle").children(".hiddenContent").is(":visible");
    alert(x);
}

CSS

.hiddenContent{
   visibility:hidden
}

jsfiddle

您能帮助理解这种差异吗？谢谢

Answer 1

.is(":visible");是 jQuery special selector检查某个元素是否可见，该元素可能会不时变化。 .is("visible");是一个标准选择器，用于检查元素是否为 <visible />并且不会告诉您任何有关其可见性的信息。