Tasarım Kodlama

JavaScript Örnekleri

Bu konudaki JavaScript Örnekleri kolay,orta seviye ve ileri seviye olarak gerçekleştirilmiştir.

Örneklerde Temel JavaScript konuları ve JavaScript kodlarının kullanımının öğretilmesi hedeflenmiştir.

JavaScript ile basit yazdırma işlemleri, JavaScript Koşul (If-Else) Örnekleri,JavaScript Döngü Örnekleri gibi bir çok örneğe ulaşacağınız bu konu sürekli olarak güncellenecektir.

Örneklerin çoğunluğu HTML Form elemanları kullanılarak, yani input,button gibi kontroller kullanılarak ve kullanıcı etkileşimi sağlanarak gerçekleştirilecektir.

Ayrıca diğer JavaScript konuları için site arama bölümü veya Web Tasarım ana menüsü altındaki JavaScript menüsüne tıklayabilirsiniz.

 

JavaScript Örnekleri

JavaScript Basit Aritmetiksel ve Metinsel  Örnekler

Örnek 1: JavaScript ile Mesaj Penceresi kullanarak ekranda “Merhaba Dünya” yazdırınız.

Çıktı:

Örnek 2: JavaScript ile sayfadaki bir elemana (p, div, h1, h2, vb.) “Merhaba Dünya” yazdırınız.

Çıktı:

Örnek 3: JavaScript ile değişken oluşturarak iki metni birleştiren ve mesaj penceresinde gösteren örneği oluşturunuz.

Çıktı:

Örnek 4: JavaScript ile değişken oluşturarak iki sayıyı toplayan ve sonucu bir div içinde gösteren örneği oluşturunuz.

Çıktı:

50

Örnek 5: JavaScript ile kullanıcıdan input içinde adını girmesini isteyerek, Buttona basıldığında alert ekranında “Merhaba [kullanici]” yazdırılmasını sağlayan örneği oluşturunuz.

Çıktı:

Örnek 6: JavaScript ile input lara girilen 2 sayıyı toplayan ve sonucu gösteren örneği oluşturunuz.

Çıktı:

Örnek 7: JavaScript ile kenar uzunluğu girilen karenin alan ve çevresini hesaplayan örneği oluşturunuz.

Çıktı:

Örnek 8: JavaScript ile kullanıcının girdiği yazılı notlarının ortalamasını hesaplayan örneği oluşturunuz.

Örnek 9: JavaScript ile Kısa ve Uzun Kenarı girilen Dikdörtgenin  Alanı ve Çevresini Hesaplayan örneği oluşturunuz.

Örnek 10: JavaScript ile Tek button ile (Hesapla) butonuna basıldığında kullanıcının girdiği iki sayının toplamı, farkı, çarpımı ve bölümünü hesaplayan dört işlem örneğini oluşturunuz.

Örnek 11: JavaScript ile dört adet button ile (Topla, Çıkar, Çarp, Böl) dört işlem örneğini oluşturunuz.

Örnek 12: JavaScript ile Arttır ve Azalt butonları kullanarak ekrandaki sayı değerinin değişimini sağlayan örneği oluşturunuz.

Örnek 13: JavaScript ile Vize ve Final notu girilen öğrencinin ortalamasını hesaplayan örneği oluşturunuz.

Örnek 14: JavaScript ile input nesnesine girilen metni Button kullanmadan her değişiklik olduğunda div içerisinde yazdırınız. (oninput olayı)

Örnek 15: JavaScript ile input nesnesine girilen metni sayfadaki listeye liste elemanı olarak ekleyen örneği oluşturunuz.

Çıktı:

JavaScript Koşul (If- Else) Örnekleri

Örnek 16: JavaScript ile girilen sayının tek mi çift mi olduğunu bulan örneği oluşturunuz.

Çıktı:

Örnek 17: JavaScript ile not ortalaması hesaplanan öğrencinin Geçme ve Kalma durumunu ekranda gösteren (Ortalama 50′ den küçükse “Kaldı” değilse “Geçti”) örneği oluşturunuz.

Örnek 18: JavaScript ile not ortalaması hesaplanan öğrencinin ortalaması 50 ve üstündeyse yeşil renkli, değilse kırmızı renkli olacak şekilde CSS özelliğini değiştiren örneği oluşturunuz.

Örnek 19: JavaScript ile Vize ve Final ortalaması hesaplanan öğrencinin Final notu ve Ortalaması 50 ve üzerindeyse Durumunu “GEÇTİ” diğer durumlarda “KALDI” olarak gösteren örneği oluşturunuz.

Örnek 20: JavaScript ile girilen sayının pozitif, sıfır ya da negatif olduğunu ekranda gösteriniz.

Örnek 21: JavaScript ile 0-100 arası girilen notu 5 lik sisteme çeviren örneği oluşturunuz.

Çıktı:

Örnek 22: JavaScript ile girilen iki sayıyı karşılaştıran örneği oluşturunuz.

Örnek 23:JavaScript ile girilen sayının 0-100 arası olup olmadığını kontrol eden örneği oluşturunuz.

Örnek 24: JavaScript ile girilen iki sayıyı Select ile yapılan seçime göre işlem yatıran örneği oluşturunuz.

JavaScript Döngü (For) Örnekleri

Örnek 25: JavaScript ile ekranda 10 defa “Merhaba Dünya” yazdıran örneği For Döngüsü kullanarak oluşturunuz.

Örnek 26: JavaScript ile input kontrolüne girilen metni 10 defa ekranda yazdıran örneği For Döngüsü kullanarak oluşturunuz.

Örnek 27: JavaScript ile Girilen metni girilen adet kadar ekranda alt alta yazdıran örneği For Döngüsü kullanarak oluşturunuz.

Çıktı:

Örnek 28: JavaScript ile 1′ den 10′ a kadar sayıları yan yana yazdıran örneği For Döngüsü kullanarak oluşturunuz..

Örnek 29: JavaScript ile 10-30 arası sayıları ekranda yazdıran örneği For Döngüsü kullanarak oluşturunuz.

Örnek 30: JavaScript ile input nesnelerine girilen iki sayı arasındaki sayıları yazdıran örneği For Döngüsü kullanarak oluşturunuz.

Örnek 31: JavaScript ile 1′ den girilen sayıya kadar olan sayıları toplayan örneği For Döngüsü kullanarak oluşturunuz.

Örnek 32: JavaScript ile girilen iki sayı arasındaki sayıları toplayan örneği For Döngüsü kullanarak oluşturunuz.

Örnek 33: JavaScript ile girilen sayının faktoriyelini hesaplayan örneği örneği For Döngüsü kullanarak oluşturunuz.

Örnek 34: JavaScript ile girilen sayının asal sayı olup olmadığını kontrol eden örneği For Döngüsü kullanarak oluşturunuz.

Örnek 35: Fare nesnenin üzerine geldiğinde nesnenin rengini değiştiren if else uygulamasını oluşturun.

Çıktı:

javascript örnekleri
javascript örnekleri

Kod:

Örnek 36: Bu javascript örneğinde aktif olan butondan önce basılan butonu hafızada tutup aktif olan buton ile önceki butona efekt uygulama örneğini yapacağız.

Kod:

DEMO

Yorum yap