Pemilih visible
Pemilih :visible memilih semua elemen yang kelihatan
pada halaman.
Elemen dengan visibility: hidden atau dengan
opacity: 0 dianggap kelihatan, kerana mereka masih menduduki
ruang dalam susun atur.
Elemen dianggap kelihatan jika mereka menduduki
ruang dalam dokumen. Elemen yang kelihatan mempunyai ketinggian
dan lebar yang bukan 0.
Oleh kerana :visible bukan sebahagian daripada spesifikasi CSS,
untuk meningkatkan prestasi dalam pelayar moden
adalah lebih baik untuk menapis elemen terlebih dahulu
dengan menggunakan pemilih css tulen, dan kemudian
gunakan .filter(':visible').
Mengawasi keterlihatan elemen dengan kaedah lain,
contohnya, dengan menggunakan kelas, boleh
menjamin prestasi yang lebih baik.
Sintaks
Beginilah cara kita memilih elemen yang kelihatan:
$(':visible');
Contoh
Mari kita tunjukkan petak-petak yang tidak kelihatan apabila butang diklik. Apabila "petak yang kelihatan" diklik, latar belakangnya akan bertukar kepada kuning:
<button id="show">tunjukkan</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');
});
