Hidden-Selektor

Der Selektor :hidden wählt alle Elemente auf der Seite aus, die ausgeblendet sind. Elemente mit visibility: hidden oder mit opacity: 0 gelten als sichtbar, da sie Platz im Layout einnehmen. Elemente können aus mehreren Gründen als unsichtbar gelten: Der Wert der CSS-Eigenschaft display ist none, oder es sind Elemente mit dem Attribut type="hidden", oder ihre Höhe oder Breite ist auf 0 gesetzt, oder ihr übergeordnetes Element ist ausgeblendet. Da :hidden nicht zur CSS-Spezifikation gehört, ist es für eine bessere Leistung in modernen Browsern besser, die Elemente zunächst mit einem reinen CSS-Selektor zu filtern und dann .filter(':hidden') anzuwenden. Das Verfolgen der Sichtbarkeit von Elementen mit anderen Methoden, beispielsweise mit einer Klasse, kann eine bessere Leistung bieten.

Syntax

So wählen wir ausgeblendete Elemente aus:

javascript$(':hidden');

Beispiel

Lassen Sie uns beim Klick auf die Schaltfläche #test die unsichtbaren Quadrate anzeigen:

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

Siehe auch