JavaScript Ekrana Yazdırma

JavaScript ile yapılan hesaplamaların sonucunu, değişkenlerin değerini veya herhangi bir veriyi görebilmek için ekrana yazdırmamız gerekir.

Ekrana yazdırma işlemi;

  • HTML nesnelerine yazdırma – innerHTML,
  • HTML sayfasına yazdırma – document.write(),
  • Uyarı pencersine yazdırma – alert(),
  • Tarayıcı konsoluna yazdırma – console.log()

innerHTML kullanma

JavaScript ile HTML nesnelerini seçmek için genellikle document.getElementById(ID) yöntemi kullanılır.

Seçim işleminden sonra innerHTML özelliği ile seçilen HTML nesnesinin içeriğini değiştirebiliriz.

<p id="p1"></p>

<script>
  document.getElementById("p1").innerHTML = "Merhaba JavaScript";
</script>

document.write() kullanımı

JavaScript komutlarını test etmek ve sonuçları ekrana hızlı bir şekilde yazdırmak için document.write() metodu kullanılır.

<p>Burası bir paragraf</p>

<script>
  document.write("Merhaba JavaScript");
</script>

document.write() metodu bir olay sonucu kullanılırsa saydaki tüm HTML elemanları silinecektir.

<p>Burası bir paragraf</p>

<button onclick="document.write('Merhaba JavaScript')">Buraya tıkla</button>

alert() kullanımı

JavaScript verilerini uyarı mesajı olarak ekran yazdırmak için alert() metodunu kullanılır.

<p>Burası bir paragraf</p>

<script>
  alert("Merhaba JavaScript");
</script>

console.log() kullanımı

JavaScript Diziler, Nesneler üzerinde işlemler görüntülemek veya yazılan komutları daha performanslı hale getirmek ve ekrana yazdırmak için console.log() kullanabilirsiniz.

<p>Burası bir paragraf</p>

<script>
  console.log("Merhaba JavaScript");
</script>

NOT: Sonucu görebilmek için Tarayıcınızın Konsol Ekranı bölümünün aktif olması gerekir.

JavaScript Derslerine buradan ulaşabilirsiniz…

Hayırlı günler dilerim.

Bunlar da hoşunuza gidebilir...

7 Cevaplar

  1. oznur dedi ki:

    Merhaba ben üstüne yazdırma işlemi yapmak istiyorum yani metni silmeden altına yazsın, tekrar çalıştığında yine alt satırına yazsın içeriği silmesin bunu nasıl yapabilirim.

    • Yusuf SEZER dedi ki:

      Merhaba dediğiniz işlemi
      innerHTML += ile
      document.getElementById(“p1”).innerHTML += “eklenecek HTML kodu buraya yazılacak”;
      veya insertAdjacentHTML metodu ile
      document.getElementById(“p1”).insertAdjacentHTML(“beforeend”, “eklenecek HTML kodu buraya yazılacak”);
      biçiminde yapabilirsiniz.

  2. onur dedi ki:

    iyi günler butona tıklandığında listbox a butonun value değerinin eklenmesini istiyorum. Bunu javascript kodları kullanarak nasıl yapabilirim

  3. ömer dedi ki:

    merhaba,login sayfam var.kullanıcılar bir dizi içinde.kullanıcı girş yaptığında yenir bir sayfa açıp bu kullanıcının mail adresini yazdırmak istiyorum lakin hep null görünüyor yani ulaşamıyorum diziye

    • Yusuf SEZER dedi ki:

      Merhaba,
      JavaScript ile yazdırma işlemi sırasında güncel tarayıcılarda olan konsol ekranına yazdırmayı kullanmazı daha iyi olur.
      Örneğin siz e-posta bilgisine kullanici[0].eposta gibi bir yol ile ulaşmak isterken değer yoktur veya yanlış yazdırıyor olabilirsiniz.
      Bu durumda console.log(kullanici) gibi bir yazım ile dizi veya nesne içindeki yolu takip ederek uygun değere ulaşabilirsiniz.

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir