by 
Menyembunyikan atau memunculkan elemen adalah dasar interaksi web seperti menu dropdown, popup, atau panel FAQ. Artikel ini membahas cara menampilkan dan menyembunyikan elemen di JavaScript.
Properti style.display
<script>
const el = document.getElementById("kotak");
el.style.display = "none"; // sembunyikan
el.style.display = "block"; // tampilkan
</script>
Contoh Kasus: Tombol Buka-Tutup Panel
<script>
function togglePanel() {
const panel = document.getElementById("panel");
panel.style.display = (panel.style.display === "none") ? "block" : "none";
}
</script>
Cara Lebih Rapi dengan Kelas CSS
<script>
// CSS: .sembunyi { display: none; }
document.getElementById("kotak").classList.toggle("sembunyi");
</script>
Menggunakan kelas CSS memisahkan tampilan dari logika, membuat kode lebih bersih dan mudah dianimasikan.
Kesimpulan
Gunakan style.display untuk menampilkan/menyembunyikan elemen secara langsung, atau classList.toggle() dengan kelas CSS untuk pendekatan yang lebih rapi dan mudah dianimasikan.
Referensi: untuk penjelasan lebih mendalam, kunjungi dokumentasi resmi JavaScript (MDN).
