Hidden-selector

Selectoren :hidden vælger alle elementer på siden, som er skjulte. Elementer med visibility: hidden eller med opacity: 0 betragtes som synlige, da de optager plads i layoutet. Elementer kan betragtes som usynlige af flere årsager: værdien af css-egenskaben display er none, eller det er elementer med attributten type="hidden", eller deres højde eller bredde er sat til 0, eller deres overordnede element er skjult. Da :hidden ikke hører til CSS-specifikationen, er det for at forbedre ydeevnen i moderne browsere bedst at filtrere elementer i starten med brug af en ren css-selector, og derefter anvende .filter(':hidden'). Sporing af elementers synlighed med andre metoder, for eksempel med en klasse, kan sikre bedre ydeevne.

Syntaks

Sådan vælger vi skjulte elementer:

javascript$(':hidden');

Eksempel

Lad os ved klik på knappen #test vis de usynlige kvadrater:

html<button id="test">vis</button>
<div></div>
<div style="display:none;"></div>
<div></div>
<div></div>
<div style="display:none;"></div>

cssdiv {
  width: 40px;
  height: 40px;
  margin: 5px;
  border: 2px outset green;
  float: left;
}

javascript$('#test').click(function() {
  $('div:hidden').show('slow');
});

Se også