Görünür Seçici

:visible seçicisi, sayfadaki tüm görünür elementleri seçer. visibility: hidden veya opacity: 0 olan elementler, düzen içinde yer kapladıkları için görünür kabul edilir. Elementler, belgede yer kaplıyorlarsa görünür olarak kabul edilir. Görünür elementlerin yükseklik ve genişlikleri 0'dan farklıdır. :visible CSS spesifikasyonuna ait olmadığı için, modern tarayıcılarda performansı artırmak amacıyla önce saf css seçicisi kullanarak elementleri filtrelemek, ardından .filter(':visible') uygulamak daha iyidir. Elementlerin görünürlüğünü başka yöntemlerle, örneğin bir sınıf kullanarak takip etmek, daha iyi performans sağlayabilir.

Sözdizimi

Görünür elementleri şu şekilde seçeriz:

javascript$(':visible');

Örnek

Hadi bir butona tıklayarak görünmeyen kareleri gösterelim. "Görünür" karelere tıklandığında arka planları sarıya dönüşecek:

html<button id="show">göster</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$('div:visible').click(function() {
  $(this).css('background', 'yellow');
});

$('#show').click(function() {
  $('div:hidden').show('slow');
});

Ayrıca Bakınız