Hidden selector
De selector :hidden selecteert alle elementen op
de pagina die verborgen zijn.
Elementen met visibility: hidden of met
opacity: 0 worden als zichtbaar beschouwd, omdat ze
ruimte innemen in de lay-out. Elementen kunnen om
verschillende redenen als onzichtbaar worden
beschouwd: de waarde van de css-eigenschap
display is none, of het zijn elementen met
het attribuut type="hidden",
of hun hoogte of breedte is ingesteld op 0,
of hun bovenliggende element is verborgen.
Omdat :hidden niet tot de CSS-specificatie behoort,
is het voor betere prestaties in moderne
browsers beter om eerst elementen te filteren met
behulp van een pure css-selector, en vervolgens
.filter(':hidden') toe te passen.
Het bijhouden van de zichtbaarheid van elementen met andere
methoden, bijvoorbeeld met een klasse, kan
betere prestaties opleveren.
Syntaxis
Zo selecteren we verborgen elementen:
$(':hidden');
Voorbeeld
Laten we op klik op de knop #test
de onzichtbare vierkantjes tonen:
<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');
});