Javascript Ekrana Yazı Yazdırma
Hepinize merhaba dostlarım :) Bu postumda bir farklı konuya giriş yapayım dedim sürekli hep php olmaz :) zaman gelecek dinamiklik vermek için sayfalarımıza javascript, jquery gibi araçlar da kullanacağız. O halde niçin bekliyoruz :) Hadi başlayalım
Dostlarım javascriptte ekrana yazı basmak için 3 farklı yöntem vardır. Bunlar:
- document.write()
- alert()
- console.log()
bu 3 işlemden her birisini adım adım örneklerle inceleyelim dostlarım
1-) document.write()
Dostlarım işin teorik tanımından ziyade mantığını öğretmek her alanda tercihim olan anlatış tarzıdır. Bu sebepten dolayı mantık üzerinden gideceğiz.
Şimdi bir web sayfasında h1 etiketleri arasında veya body kısmında yazı yazdırmak için aşağıdaki işlem gibi yapıyorduk
<!DOCTYPE html>
<html>
<head>
<title>Javascript | MFSoftware Blog</title>
</head>
<body>
<h1>Merhaba Dostlarım</h1>
<p>Merhaba Javascript</p>
</body>
</html>
bu şekilde yazdırıyorduk. Gelin şimdi size javascript ile nasıl yazdıracağımızı göstereyim. Ama öncelikle ufak bir anlatım yapcam.
Dostlarım bu html kodları birer döküman olduğu için mantık olarak kodumuzda diyoruz ki bu html tag i içerisinde bir script çalışacak ve bu da dökümana (html dökümanına) bir yazı yazacak :). Mantık tamamen bundan ibaret. Yalnız bu script taglerini body etiketleri içerisinde yani gövde kısmında yazmamız lazım :). Gelin ufak bir örnekle başlayalım
<!DOCTYPE html>
<html>
<head>
<title>Javascript | MFSoftware Blog</title>
</head>
<body>
<h1>
<script>document.write("Merhaba Dostlarım");</script>
</h1>
<p>
<script>document.write("Merhaba Javascript");</script>
</p>
</body>
</html>
olarak kullanacağız. Çok zor bir şey yok :) ek olarak sadece bir tag ve birkaç kod kullandık. Hadi yazdık biz bu kodu ama ekran çıktısı ne oldu dediğinizi duyar gibiyim :). Gelin ona da bakalım
<!-- EKRAN ÇIKTISI -->
Merhaba Dostlarım
Merhaba Javascript
işte bu kadar dostlarım :). Gelelim 2. konumuz olan alert() kısmına
2-) alert()
Dostlarım bunu çok basit şekilde anlayacağınıza adım gibi eminim. Mantığını anlatarak devam etmek istiyorum. Günümüzde bazı internet sitelerinde "Sitemize hoşgeldiniz" diye yukarıda ortada bir mesaj çıkar. İşte bu şekilde mesajları alert ile sağlarız :). Nasıl kullanılıyor diye merak ettiyseniz hemen kodlamada göstereyim
<!DOCTYPE html>
<html>
<head>
<title>Javascript | MFSoftware Blog</title>
</head>
<body>
<script>
alert("Merhaba Javascript");
</script>
</body>
</html>
olarak yazalım. Bu kodu çalıştırdığınız an site açılır açılmaz ekranın üst orta kısmında "Merhaba Javascript" mesajı çıkacaktır :). Gelelim 3. ve geliştiricilerin sürekli kullanmış oldukları console.log() kullanımına bakalım
3-) console.log()
Dostlarım 3. ve sürekli kullanılan bir ekrana yazdırma daha doğrusu console kısmına yazdırma işlemini inceleyelim. Bunun kullanımından mantıken bahsetmek gerekirse dostlarım veri tabanından bir dizi veya json olarak bir yazı çektiğimizi varsayalım ve bu baya uzun olsun. Bunu alert() ile gösterirsek hepsini göstermeyecektir. Document.write() ile göstermeye çalışırsak kodlarımızı bozacaktır ve bu json ağacının altındaki yazıları sağlıklı bir şekilde göstermeyecektir. Bunun için en sağlıklı yöntem console.log() olacaktır. Gelin ufak bir kodla console kısmında "Merhaba Javascript" yazdıralım
<!DOCTYPE html>
<html>
<head>
<title>Javascript | MFSoftware Blog</title>
</head>
<body>
<script>
console.log("Merhaba Javascript");
</script>
</body>
</html>
bu şekilde dostlarım kodu yazdık. Çıktısını beyaz sayfada yani body kısmına göremeyiz. Peki nasıl görcez diye merak etmiş olabilirsiniz :). F12 tuşuna basınız ve daha sonra console seçeneğine tıklayınız. Daha sonra o kısımda console.log() içerisine yazmış olduğunuz kodları göreceksiniz.
Javascript ile ekrana yazı yazdırma konumuz burada son buluyor dostlarım :) Hayallerinizi gerçekleştirmeniz dileklerimle... İyi çalışmalar :)
Yazar Hakkında
Kendi Halinde Bir Backend Developer