Selektor visible
Selektor :visible valib kõik lehel nähtavad
elemendid.
Elemendid, millel on visibility: hidden või
opacity: 0, loetakse nähtavateks, kuna nad võtavad
ruumi lehekülje paigutuses.
Elemendid loetakse nähtavateks, kui nad võtavad
ruumi dokumendis. Nähtavatel elementidel on kõrgus
ja laius, mis ei ole 0.
Kuna :visible ei kuulu CSS-i spetsifikatsiooni,
siis kaasaegsetes brauserites on jõudluse parandamiseks
soovitatav kõigepealt filtreerida elemendid
kasutades puhtaid CSS-selektoreid ning seejärel
rakendada .filter(':visible').
Elementide nähtavuse jälgimine teiste
meetoditega, näiteks klassi abil, võib
pakkuda paremat jõudlust.
Süntaks
Nii valime nähtavad elemendid:
$(':visible');
Näide
Klõpsuga nupul näitame peidetud ruudud. "Nähtavatele" ruutudele vajutamisel muudetakse nende taust kollaseks:
<button id="show">show</button>
<div></div>
<div style="display:none;"></div>
<div></div>
<div></div>
<div style="display:none;"></div>
div {
width: 40px;
height: 40px;
margin: 5px;
border: 2px outset green;
float: left;
}
$('div:visible').click(function() {
$(this).css('background', 'yellow');
});
$('#show').click(function() {
$('div:hidden').show('slow');
});
