Örnek Javascript Kodları 2

İşte bir HTML sayfası içinde başka birkaç örnek JavaScript kodu:

<!DOCTYPE html> <html lang="tr"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>JavaScript Örnek 2</title> <script> // JavaScript kodları buraya yazılır // Örnek 4: Temel bir döngü kullanarak sayıları gösterme function showNumbers() { var output = ""; for (var i = 1; i <= 5; i++) { output += i + "<br>"; } document.getElementById("numberList").innerHTML = output; } // Örnek 5: Kullanıcının girdiği sayıya kadar olan sayıları toplama function sumNumbers() { var limit = parseInt(prompt("Bir sayı girin:")); var sum = 0; for (var i = 1; i <= limit; i++) { sum += i; } alert("Toplam: " + sum); } // Örnek 6: Mouse ile üzerine gelindiğinde rengi değiştirme function changeColorOnHover(element) { element.style.color = "red"; } function restoreColor(element) { element.style.color = "black"; } </script> </head> <body> <h1>JavaScript Örnek 2</h1> <button onclick="showNumbers()">Sayıları Göster</button> <button onclick="sumNumbers()">Sayıları Topla</button> <p id="numberList"></p> <p onmouseover="changeColorOnHover(this)" onmouseout="restoreColor(this)"> Mouse ile üzerime gelindiğinde rengim değişir. </p> </body> </html>

Bu örnekte:

  • showNumbers fonksiyonu, bir döngü kullanarak 1'den 5'e kadar olan sayıları bir paragraf içinde gösterir.
  • sumNumbers fonksiyonu, kullanıcıdan bir sayı alır ve 1'den o sayıya kadar olan sayıları toplar, sonucu bir uyarı penceresinde gösterir.
  • changeColorOnHover ve restoreColor fonksiyonları, bir HTML paragraf elementinin üzerine gelindiğinde rengini değiştirme ve üzerinden çıkıldığında eski rengine geri döndürme işlemlerini yapar.

Bu örnekleri tarayıcınızda açarak çalıştırabilir ve fonksiyonların nasıl çalıştığını gözlemleyebilirsiniz.



Yorum Ekle

Üzerine gel