Basit JavaScript Örnekleri

Web sayfalarını oluşturmak için gereken html dili, sayfaya bir çok işlev kazandırmasının yanında, aslında statik yani durağan sayfalardan öteye geçemez. Sayfaları hareketlendiren yani bir dinamizm sağlayan ise Java Script dilidir. Java Scriptler genelde işlevine göre çok gelişmiş yazılımlardır. Ancak başlangıç seviyesinde, bazı küçük scriptler ile hazırlayacağımız web sayfalarına ziyaretçilerimize hoş gelecek bazı atraksiyonlar ekleyebiliriz. Tarayıcımızın altına sitemizin adını hem de akar bir yazı olarak eklemek, web sayfamızın bir yerine günün tarihini veya o anki saati eklemek, yazılan yazıların parıldamasını saplamak, sayfamıza bir haber bandı koymak, web sayfamızı, ziyaretçimizin "Sık Kullanılanlar" klasörüne ekletmek, bir düğme ile değişen arka plan renkleri gibi bir çok hareketlilik ancak Java Script kodları ile olası olmaktadır.Java Script genelde iki ayrı bölümden oluşur. Birinci bölüm tarayıcıya scriptin nasıl uygulanacağını emreden ve <head></head> takısı arasına eklenen yaptırıcı yazılımdır (EVENT). İkinci bölüm ise <body></body> takısı arasına eklenen ve <head></head> takısı arasında scriptin çalışmasını emreden komutları uygulayan kısımdır (EVENT-HANDLER). Her Java Script bu şekilde çalışmaz ama tarayıcıdan istenen görevin kapasitesi arttıkça, bu tarz bir bölünme zorunluluğu duyulur.

Şimdi web sayfalarımızda kolayca kullanabileceğimiz bir kaç Java Script örneği ile sayfalarımızı biraz hareketlendirelim.

Tarayınıcızın durum çuuğunda sayfanızdaki bağlantının açıklamasını göstermek

<html>
<head>
<title>Java Script Denemeleri</title>
</head>
<body>
<a href="sayfa2.html" onMouseOver="window.status='Buraya tıkladığınızda 2.html sayfama gideceksiniz.';
return true" onMouseOut="window.status=' ';   ">Bu bağlantının üstüne gelin</a>
</body>
</html>

js 1

Bu scripti Not Defterinize yazın ve kaydedin. Yanlız yazarken noktalamalara azami dikkat edin. Java Script bu hususta çok hassastır. Kodlamada yapacağınız hatalar scriptin çalışmamasına neden olur. Java Script yazarken küçük ve büyük harfler dahi dikkatle yazılmalıdır. Çünkü anlamları farklı olabilir.

Bu scriptin yazılı olduğu sayfaya tarayıcınızdan bakın. Fare imlecinizi bağlantının üzerine tıklamadan gezdirince tarayıcınızın Satatus Barında (Durum Çubuğu) "Buraya tıkladığınızda 2. html sayfama gideceksiniz" yazısı görüntülendi.

Bu scriptte (event) yani tarayıcıya emreden komut "onMouseOver", (event-handler) yani komutu uygulayan kısım ise, "window.status" bölümündeki  "Buraya tıkladığınızda 2.html sayfama gideceksiniz" komutu.

Html sayfanızın son güncelleme tarihini görüntülemek

Bu yeni yazacağımız scriptte emir-komuta sıralaması kullanılmıyor. "event" kullanılmadığı için ve yazılan kodun bir java script kodu olduğunu tarayıcımızın anlaması için bu kod <script> ve </script> takıları arasına ve yazılan kodun bir Java Script kodu olduğu belirtilerek yapılır. Burada sadece <script> ve </script> takılarını kullanmak tarayıcının o işlemin ne olduğunu anlamasına yetmez.
Bu örnek kodu yine dikkatlice Not Defterinize yazın ve kaydedin.

<html>
<head>
<title>Java Script Denemeleri</title>
</head>
<body>
<SCRIPT LANGUAGE="JavaScript">
<!--
document.write(son güncelleme :") ;
document.write(document.lastModified) ;
// -->
</script>
</body>
</html>

js 2

İşte sayfanızın son güncelleme tarihini ziyaretçilerinize gösterdiniz.

Web sayfanızdan popup (açılan pencere) ile mesaj iletmek

<html>
<head>
<title>Java Script Denemeleri</title>
</head>
<body>
<SCRIPT LANGUAGE="JavaScript">
<!--
window.alert("Merhaba")
// -->
</SCRIPT>
</body>
</html>

Bu kodu yazdığınızda tarayıcınızın üzerinde minik bir pop pencere açılacak ve iletiniz bu pencere aracılığı ile ziyaretçilerinize ulaşacaktır.

js 3

JavaScript uygulamaları Sayfa : 2

hosting Untitled Document
Hosted by Solutions Atgig Corp.