Hidden-selectorn

Selectorn :hidden väljer alla element på sidan som är dolda. Element med visibility: hidden eller med opacity: 0 anses vara synliga eftersom de upptar plats i layouten. Element kan anses osynliga av flera anledningar: värdet på css-egenskapen display är none, eller så är det element med attributet type="hidden", eller deras höjd eller bredd är satt till 0, eller deras förälderelement är dolt. Eftersom :hidden inte tillhör CSS-specifikationen, är det för bättre prestanda i moderna webbläsare att först filtrera element med ren css-selector, och sedan tillämpa .filter(':hidden'). Spårning av elementens synlighet med andra metoder, till exempel med en klass, kan ge bättre prestanda.

Syntax

Så här väljer vi dolda element:

javascript$(':hidden');

Exempel

Låt oss vid klick på knappen #test visa de osynliga kvadraterna:

html<button id="test">show</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 även