Selektor hidden

Selektor :hidden wybiera wszystkie elementy na stronie, które są ukryte. Elementy z visibility: hidden lub z opacity: 0 są uważane za widoczne, ponieważ zajmują miejsce w układzie. Elementy mogą być uważane za niewidoczne z kilku powodów: wartość właściwości css display - none, lub są to elementy z atrybutem type="hidden", lub ich wysokość lub szerokość jest ustawiona na 0, albo ich element nadrzędny jest ukryty. Ponieważ :hidden nie należy do specyfikacji CSS, to dla poprawy wydajności w nowoczesnych przeglądarkach lepiej najpierw odfiltrować elementy z użyciem czystego selektora css, a następnie zastosować .filter(':hidden'). Śledzenie widoczności elementów za pomocą innych metod, na przykład za pomocą klasy, może zapewnić lepszą wydajność.

Składnia

Tak wybieramy ukryte elementy:

javascript$(':hidden');

Przykład

Po kliknięciu przycisku #test pokażmy niewidoczne kwadraty:

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

Zobacz też