by 
Terkadang kita perlu menyisipkan HTML, bukan sekadar teks, misalnya membangun daftar atau kartu dari data. Artikel ini membahas cara mengubah konten HTML elemen dengan innerHTML di JavaScript, beserta risikonya.
Properti innerHTML
<div id="wadah"></div>
<script>
document.getElementById("wadah").innerHTML = "<strong>Halo</strong>";
</script>
Contoh Kasus: Membangun Daftar dari Array
<script>
const buah = ["Apel", "Mangga", "Jeruk"];
const html = buah.map(b => `<li>${b}</li>`).join("");
document.getElementById("daftar").innerHTML = html;
</script>
Peringatan Keamanan (XSS)
Jangan pernah memasukkan data dari pengguna langsung ke innerHTML — ini membuka celah serangan XSS (menyisipkan skrip berbahaya). Untuk teks biasa, gunakan textContent.
<script> // BERBAHAYA jika komentar berasal dari pengguna: el.innerHTML = komentarPengguna; // jangan lakukan ini // AMAN: el.textContent = komentarPengguna; </script>
Kesimpulan
Gunakan innerHTML hanya untuk konten yang Anda kendalikan sepenuhnya, seperti membangun HTML dari data internal. Untuk data pengguna, selalu pilih textContent demi keamanan.
Referensi: untuk penjelasan lebih mendalam, kunjungi dokumentasi resmi JavaScript (MDN).
