# :hidden Selector

所属分类：选择器 > jQuery 扩展 | 选择器 > 可见性过滤 英文文档：:hidden Selector

## hidden selector

描述: 选择所有隐藏的元素。

- #### 添加的版本: 1.0jQuery( ":hidden" )

元素可以被认为是隐藏的几个情况：

- 他们的CSS `display`值是`none`。
- 他们是`type="hidden"`的表单元素。
- 它们的宽度和高度都显式设置为0。
- 一个祖先元素是隐藏的，因此该元素是不会在页面上显示。

元素`visibility: hidden`或`opacity: 0`被认为是可见的，因为他们仍然占据布局空间。在动画，隐藏一个元素，该元素被认为是可见的直到动画结束。

不在文档中的元素是被认为是不可见的;如果当他们被插入到文档中，jQuery没有办法知道他们是否是可见的，因为元素可见性依赖于适用的样式。

在动画显示的元素期间，动画一旦开始，该元素就被认为是可见的。

在jQuery 1.3.2中，`:hidden`判断方式做了修改。如果他或者其任何父级元素不占据布局空间，这个元素就被认为是隐藏的。CSS的能见度属性（visibility）不影响这个选择器的判断（因此`$(elem).css('visibility','hidden').is(':hidden') == false` ）。更详细的大纲的变化:release notes。

### Additional Notes（其他注意事项）:

- 因为 `:hidden()` 是一个 jQuery 延伸出来的一个选择器。 并且不是的CSS规范的一部分, 使用`:hidden()`查询不能充分利用原生DOM提供的`querySelectorAll()` 方法来提高性能。为了在现代浏览器上获得更佳的性能，请使用`.filter(":hidden")`代替。

## 例子:

#### 示所有隐藏divs和统计隐藏的inputs。

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 |
    <!DOCTYPE html><html><head>  <style>  div { width:70px; height:40px; background:#ee77ff; margin:5px; float:left; }  span { display:block; clear:left; color:red; }  .starthidden { display:none; }  </style>  <script src="https://code.jquery.com/jquery-latest.js"></script></head><body>  <span></span>  <div></div>  <div style="display:none;">Hider!</div>  <div></div>   <div class="starthidden">Hider!</div>  <div></div>  <form>    <input type="hidden" />     <input type="hidden" />    <input type="hidden" />  </form>  <span>   </span><script>// in some browsers :hidden includes head, title, script, etc...var hiddenEls = $("body").find(":hidden").not("script"); $("span:first").text("Found " + hiddenEls.length + " hidden elements total.");$("div:hidden").show(3000);$("span:last").text("Found " + $("input:hidden").length + " hidden inputs.");</script> </body></html>

#### Demo: