innerHTML
, bir HTML elementinin içerik (metin ve HTML etiketleri) kısmına erişmenizi ve bu içerikleri değiştirmenizi sağlayan bir özelliktir.
Örneğin:
<body>
<div id="box1"></div>
</body>
yukarıdaki, div in içeriğine javascript ile yazı yazmamızı sağlar.
var box = document.getElementById("box1");
box.innerHTML = "Hello, World!";
bu şekilde yukarıdaki div
in html
olan kısmına javascript
ile yazı yazdık.
Dikkat: innerHTML
kullanarak eklediğiniz metinde HTML
etiketleri de işlenir. Bu nedenle güvensiz kaynaklardan gelen veri eklemek güvenlik risklerine (XSS)
yol açabilir. Aşırı ve yanlış kullanımlardan kaçınmak gerekir.
-
Dinamik İçerik Güncelleme: Sayfadaki içeriği hızlı bir şekilde değiştirmek için.
-
Form Sonuçlarının Gösterimi: Kullanıcıdan alınan verileri sayfada anında görüntülemek için.
-
Basit Şablon Yerleştirme:
Tablo
,liste
veyakart
gibiHTML
yapısını dinamik şekilde oluşturmak için.