Επιλογέας hidden

Ο επιλογέας :hidden επιλέγει όλα τα στοιχεία στη σελίδα, που είναι κρυμμένα. Στοιχεία με visibility: hidden ή με opacity: 0 θεωρούνται ορατά, αφού καταλαμβάνουν χώρο στη διάταξη. Τα στοιχεία μπορεί να θεωρούνται αόρατα για διάφορους λόγους: η τιμή της css-ιδιότητας display είναι none, ή είναι στοιχεία με γνώρισμα type="hidden", ή το ύψος ή το πλάτος τους είναι ορισμένα σε 0, ή το γονικό τους στοιχείο είναι κρυμμένο. Εφόσον ο :hidden δεν ανήκει στην CSS προδιαγραφή, για καλύτερη απόδοση σε σύγχρονα προγράμματα πλοήγησης είναι καλύτερα στην αρχή να φιλτράρετε τα στοιχεία με χρήση καθαρού css-επιλογέα, και στη συνέχεια να εφαρμόσετε .filter(':hidden'). Η παρακολούθηση της ορατότητας των στοιχείων με άλλους τρόπους, για παράδειγμα, με χρήση κλάσης, μπορεί να προσφέρει καλύτερη απόδοση.

Σύνταξη

Έτσι επιλέγουμε τα κρυφά στοιχεία:

javascript$(':hidden');

Παράδειγμα

Ας πατήσουμε στο κουμπί #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');
});

Δείτε επίσης