Selector hidden
El selector :hidden selecciona todos los elementos en
la página que están ocultos.
Los elementos con visibility: hidden o con
opacity: 0 se consideran visibles, ya que ocupan
espacio en el diseño. Los elementos pueden considerarse invisibles
por varias razones: el valor de la propiedad CSS
display es none, o son elementos con
el atributo type="hidden",
o su altura o anchura están establecidas en 0,
o su elemento padre está oculto.
Dado que :hidden no pertenece a la especificación CSS,
para mejorar el rendimiento en los navegadores modernos
es mejor filtrar primero los elementos con
el uso de un selector CSS puro, y luego
aplicar .filter(':hidden').
Rastrear la visibilidad de los elementos usando otros
métodos, por ejemplo, usando una clase, puede
proporcionar un mejor rendimiento.
Sintaxis
Así seleccionamos los elementos ocultos:
$(':hidden');
Ejemplo
Hagamos que al hacer clic en el botón #test
se muestren los cuadrados invisibles:
<button id="test">show</button>
<div></div>
<div style="display:none;"></div>
<div></div>
<div></div>
<div style="display:none;"></div>
div {
width: 40px;
height: 40px;
margin: 5px;
border: 2px outset green;
float: left;
}
$('#test').click(function() {
$('div:hidden').show('slow');
});
