如何检查一个元素是否隐藏在jQuery中？

Question

如何检查一个元素是否隐藏在jQuery中？可以使用以下函数切换元素的可见性.hide(), .show()或.toggle().如何测试一个元素是可见的还是隐藏的？

Answer 1

由于这个问题只涉及一个元素，这段代码可能更适合：

// Checks css for display:[none|block], ignores visibility:[true|false]$(element).is(":visible"); 
// The same works with hidden$(element).is(":hidden");

同特恩特的建议，但是应用于一个单一的元素；匹配jQuery常见问题中推荐的算法。

Answer 2

您可以使用hidden选择器：

// Matches all elements that are hidden$('element:hidden')

而visible选择器：

// Matches all elements that are visible$('element:visible')

Answer 3

if ( $(element).css('display') == 'none' || $(element).css("visibility") == "hidden"){
    // element is hidden}

以上方法不考虑父方法的可见性。要同时考虑父级，您应该使用.is(":hidden")或.is(":visible").

例如,

<div id="div1" style="display:none">
  <div id="div2" style="display:block">Div2</div></div>

上述方法会考虑div2可见时:visible不。但是，在许多情况下，上面的内容可能很有用，特别是当您需要查找隐藏的父级中是否存在可见的错误div时，因为在这种情况下。:visible不会起作用的。