JavaScript verilerini veya sonuçlarını farklı yöntemlerle görüntüleyebiliriz. Bunlar:
1 – innerHtml ile bir Html öğesine yazdırabiliriz.
2 – document.write() ile bir Html çıktısına yazdırabiliriz.
3 – window.alert() ile bir uyarı kutusuna yazdırabiliriz.
4 – console.log() ile tarayıcı konsoluna yazdırabiliriz.
Şimdi sırasıyla bunların kullanımlarını inceleyelim.
innerHtml Kullanımı
Bir p etiketi tanımlayalım. Bu p etiketinin içeriğine innerHtml ile 5+12 işleminin sonucunu yazdıralım.
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<!DOCTYPE html> <html> <body> <p id="test"></p> <script> document.getElementById("test").innerHTML = 5 + 12; </script> </body> </html> |
Tarayıcıdaki Görünümü
document.write() Kullanımı
document.write() ile 5+12 işleminin sonucunu Html belgesine yazdıralım.
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<!DOCTYPE html> <html> <body> <p>İlk Paragraf.</p> <script> document.write(5 + 12); </script> </body> </html> |
Tarayıcıdaki Görünümü
Önemli : Bir HTML belgesi yüklendikten sonra document.write () kullanılması, mevcut tüm HTML’leri siler.
Örneğin;
Gördüğünüz gibi sonucu yazdırırken mevcut tüm Html’ler silindi. Bu yüzden document.write() metodunu sadece test için kullanmalısınız.
window.alert() Kullanımı
JavaScript verilerini veya sonuçlarını bir uyarı kutusu ile görüntülemek istediğimiz durumlarda window.alert() metodunu kullanabiliriz.
|
1 2 3 4 5 6 7 8 9 10 11 |
<!DOCTYPE html> <html> <body> <script> window.alert(5 + 12); </script> </body> </html> |
Tarayıcıdaki Görünümü
console.log() Kullanımı
En çok tercih edilen yöntemdir. Özellikle hata ayıklama amacıyla bu yöntemi tercih edebilirsiniz.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<!DOCTYPE html> <html> <body> <script> var a = 5; var b = 12; c = a + b; console.log("a ve b sayılarının toplamı :" + c); </script> </body> </html> |
Tarayıcıdaki Görünümü
Umarım sizin için faydalı bir yazı olmuştur.
Şu yazılar da ilginizi çekebilir.
JavaScript Nedir? JavaScript Ne İşe Yarar?
Yeni bir yazımda görüşmek üzere.
){kind=link}