Mengecek visibilitas elemen dipakai untuk logika toggle, misalnya menentukan apakah panel perlu dibuka atau ditutup. Artikel ini membahas cara memeriksa apakah elemen terlihat dengan jQuery.
Selektor :visible dan :hidden
<script>
if ($("#panel").is(":visible")) {
console.log("Sedang terlihat");
}
</script>
Contoh Kasus: Toggle Bersyarat
<script>
$("#tombol").click(function() {
const panel = $("#panel");
if (panel.is(":hidden")) {
panel.slideDown();
$(this).text("Sembunyikan");
} else {
panel.slideUp();
$(this).text("Tampilkan");
}
});
</script>
Menghitung Elemen yang Terlihat
<script>
const jumlah = $(".item:visible").length; // hanya yang terlihat
</script>
Berguna misalnya untuk menghitung berapa hasil yang tampil setelah filter.
Kesimpulan
Gunakan .is(":visible") atau .is(":hidden") untuk mengecek visibilitas sebelum menjalankan aksi tampil/sembunyi. Selektor :visible juga berguna untuk menghitung elemen yang sedang tampil.
Referensi: untuk penjelasan lebih mendalam, kunjungi dokumentasi resmi jQuery (api.jquery.com).

