Turkcell | Geleceği Yazanlar

301: JavaScriptBaşlangıç seviyesi derslerde Web Programlama uygulama geliştirme ortamını detaylı olarak inceliyoruz.

Tüm Eğitimleri Aldın mı? Kendini sınamanın tam zamanı

Haydi Sınava Gir

Form Nesnesi İle İlişkili Bir Uygulama: Büyük Küçük Harf Dönüşümü

Kategori : Mobil | Lisans : Creative Commons (by-nc-sa) | En son 12.09.2019 tarihinde güncellendi
Eğitmen : Geleceği Yazanlar Ekibi
Etiketler : web-programlama

Harf dönüşümünü JavaScript kodu ile yapalım:

<HTML>
<HEAD>
<TITLE>FORM NESNESİ-ÖRNEK</TITLE>
</HEAD>
<SCRIPT>
function degis (d){
 
    if (d == "buyuk") {

    document.form1.ad.value=document.form1.ad.value.toUpperCase()
    document.form1.soyad.value=document.form1.soyad.value.toUpperCase()}

    else {

    document.form1.ad.value=document.form1.ad.value.toLowerCase()
    document.form1.soyad.value=document.form1.soyad.value.toLowerCase()}

}
 
</SCRIPT>
 
<BODY bgColor="lightblue">
<FONT FACE="Comic Sans MS">

    <H3>FORM UYGULAMASI</H3>
 
</FONT>
 
<FORM NAME="form1">
    <B>AD:</B>

    <INPUT TYPE="text" NAME="ad" SIZE=20>

    <BR><B>SOYAD:</B>

    <INPUT TYPE="text" NAME="soyad" SIZE=20>
    <INPUT TYPE="button" VALUE="BÜYÜK HARF" NAME="buyukharf" onClick="degis('buyuk')">
    <INPUT TYPE="button" VALUE="KÜÇÜK HARF" NAME="kucukharf" onClick="degis('kucuk')">
 
</FORM>
</BODY>
</HTML>

 

JavaScript kodunun çıktısı

Burada AD ve SOYAD kutularına bir ad ve soyadı küçük harfle girerek "BÜYÜK HARF" düğmesine tıklayınız. Bu durumda girilen bilgi aşağıda görüldüğü gibi büyük harfe dönüştürülecektir:

Bu sayfada "KÜÇÜK HARF" düğesi tıklanırsa bu durumda bilgi tekrar küçük harfe dönüştürülecektir.