Konuyu Değerlendir
  • 0 Oy - 0 Ortalama
  • 1
  • 2
  • 3
  • 4
  • 5
Javascript innerHTML
#1
innerHTML kodu javascript dilinde bir HTML elemanının içeriğini değiştirmek veya var olan içeriği bir değişkene aktarmak için kullanılır. Bu kod ile eleman içinde içerik ekleyemeyiz. HTML elemanı içieriisindeki içeriği değiştiririz. İki durumu da kısaca gösterelim;

1- innerTML ile bir HTML elemanının içeriğini değiştirmek


Kod:
<button onclick="icerikYaz()">Buton</button>
<div id="icerik">Bu içerik Javascript ile Değişecek!</div>

<script>
function icerikYaz() {
   document.getElementById("icerik").innerHTML = "Javascript innerHTML ile Değişti!";
}
</script>

Bu kod butona tıklandığında id'si icerik olan div'in içeriğini değiştirir.



2- innerTML ile bir HTML elemanının içeriğini almak


Kod:
<button onclick="icerikAl()">Buton</button>
<div id="bilgi">Bu içerik Javascript ile Alınacak</div>

<script>
function icerikAl() {
   var a = document.getElementById("bilgi").innerHTML;
   alert(a);
}
</script>

Bu kodda ise butona tıklandığında çalışan icerkAl fonksiyonu id'si bilgi olan div'in içindeki içeriği a isimli bir değişkene atar ve alert ile kullanıcıya görüntüler.

NOT : innerHTML kodu ile bir elementin içerik bilgisini bir değişkene atarken sadece metin bilgisini değil; element içindeki tüm HTML kodlarını da almış oluruz. İçerikteki tüm kodlar da beraberinde gelir.
Alıntı


Foruma Git:


Bu konuyu görüntüleyen kullanıcı(lar): 1 Ziyaretçi