Selectorul hidden

Selectorul :hidden selectează toate elementele de pe pagină care sunt ascunse. Elementele cu visibility: hidden sau cu opacity: 0 sunt considerate vizibile, deoarece ocupă spațiu în layout. Elementele pot fi considerate invizibile din mai multe motive: valoarea proprietății CSS display este none, sau sunt elemente cu atributul type="hidden", sau înălțimea sau lățimea lor sunt setate la 0, sau elementul părinte este ascuns. Deoarece :hidden nu face parte din specificația CSS, pentru a îmbunătăți performanța în browserele moderne este mai bine să filtrați mai întâi elementele cu utilizarea unui selector CSS pur, iar apoi să aplicați .filter(':hidden'). Urmărirea vizibilității elementelor cu alte metode, de exemplu, cu ajutorul unei clase, poate oferi o performanță mai bună.

Sintaxă

Așa selectăm elementele ascunse:

javascript$(':hidden');

Exemplu

Să afișăm pătratele invizibile la click pe butonul #test:

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');
});

Vezi și