Text kutusuna uzun,kısa kenarı ve yüksekliği girilen yamuğun alanını hesaplayıp ekrana uyarı olarak veren program:
Nesneye olay atayarak javascript ile yamuk alanını hesaplama;
document.getElementById ile nesne oluşturulduktan sonra oluşturulan nesnenin onclick niteliğine fonksiyon tanımlaması yaparak kullanma
<input type="text" id="kenar1" placeholder="Üst Kenar Uzunluğunu Girin">
<input type="text" id="kenar2" placeholder="Alt Kenar Uzunluğunu Girin">
<input type="text" id="yukseklik" placeholder="Yüksekliği Girin">
<input type="button" value="Hesapla" id="hesapla">
<script>
function hesapla(){
//text kutusu içindeki değerleri okuyup sayi1,sayi2 değişkenine aktarıyoruz.
var sayi1=document.getElementById("kenar1").value;
var sayi2=document.getElementById("kenar2").value;
var sayi3=document.getElementById("yukseklik").value;
//text kutusuna girilen değerler metinsel türdedir. Hesaplama yapabilmek için sayıya çeviriyoruz.
sayi1=Number(sayi1);
sayi2=Number(sayi2);
sayi3=Number(sayi3);
// formül: (ustkenar+altkenar)*yukseklik/2
var alan=(sayi1+sayi2)*sayi3/2;
alert("Yamuk alanı:"+alan);
}
//hesaplama yapması için hesap butonunu seçiyoruz.
var hesapBtn=document.getElementById("hesapla");
//fonksiyonu olaya bağlıyoruz.
hesapBtn.onclick=hesapla;
</script>[divider]HTML etiketinin onclick özelliğine fonksiyon tanımlayarak javascript ile yamuk alanını hesaplama;
Etiketin onclick niteliğine fonksiyon yazılarak kullanma
<input type="text" id="kenar1" placeholder="Üst Kenar Uzunluğunu Girin">
<input type="text" id="kenar2" placeholder="Alt Kenar Uzunluğunu Girin">
<input type="text" id="yukseklik" placeholder="Yüksekliği Girin">
<input type="button" value="Hesapla" id="hesapla" onclick="hesapla()">
<script>
function hesapla(){
//text kutusu içindeki değerleri okuyup sayi1,sayi2 değişkenine aktarıyoruz.
var sayi1=document.getElementById("kenar1").value;
var sayi2=document.getElementById("kenar2").value;
var sayi3=document.getElementById("yukseklik").value;
//text kutusuna girilen değerler metinsel türdedir. Hesaplama yapabilmek için sayıya çeviriyoruz.
sayi1=Number(sayi1);
sayi2=Number(sayi2);
sayi3=Number(sayi3);
// formül: (ustkenar+altkenar)*yukseklik/2
var alan=(sayi1+sayi2)*sayi3/2;
alert("Yamuk alanı:"+alan);
}
</script>[divider]AddEventListener kullanarak javascript ile yamuk alanını hesaplama;
Nesne document.getElementById ile oluşturulduktan sonra nesnenin addEventListener işlevi ile tanımlayarak kullanma
<input type="text" id="kenar1" placeholder="Üst Kenar Uzunluğunu Girin">
<input type="text" id="kenar2" placeholder="Alt Kenar Uzunluğunu Girin">
<input type="text" id="yukseklik" placeholder="Yüksekliği Girin">
<input type="button" value="Hesapla" id="hesapla">
<script>
function hesapla(){
//text kutusu içindeki değerleri okuyup sayi1,sayi2 değişkenine aktarıyoruz.
var sayi1=document.getElementById("kenar1").value;
var sayi2=document.getElementById("kenar2").value;
var sayi3=document.getElementById("yukseklik").value;
//text kutusuna girilen değerler metinsel türdedir. Hesaplama yapabilmek için sayıya çeviriyoruz.
sayi1=Number(sayi1);
sayi2=Number(sayi2);
sayi3=Number(sayi3);
// formül: (ustkenar+altkenar)*yukseklik/2
var alan=(sayi1+sayi2)*sayi3/2;
alert("Yamuk alanı:"+alan);
}
//hesaplama yapması için hesap butonunu seçiyoruz.
var hesapBtn=document.getElementById("hesapla");
//fonksiyonu olaya bağlıyoruz.
hesapBtn.addEventListener("click",hesapla,false);
</script>[divider]window.prompt kullanarak javascript ile yamuk alanını hesaplama;
prompt ve alert metodları ile çalıştırma örneği
<script>
var ken1=Number(window.prompt('Üst Kenar Uzunluğunu Girin'));
var ken2=Number(window.prompt('Alt Kenar Uzunluğunu Girin'));
var ken3=Number(window.prompt('Yüksekliği Girin'));
//alan hesaplama
var alan=(ken1+ken2)*ken3/2;
window.alert("Alan:"+alan);
</script>
