JavaScript Web sayfaları için yeni bir scripttir. Bu yazılımların özelliği
HTML sayfanızın içine yerleştirilebilmesidir. JavaScript ile ilginç
elemanlar kullanarak HTML sayfanızı geliştirecek birçok olanağa sahip
olacaksınız. Örneğin kullanıcının sayfanızı incelerken yaptığı hareketlere
anında karşılık verebilirsiniz. Ayrıca bir zamanlar sadece CGI ile mümkün
olan bazı olaylar JavaScript ile de yapılabilir. Yani JavaScript'in
yardımıyla gerçekten de kaliteli Web sayfaları yaratabilirsiniz. Şu anda
Internet üzerinde JavaScript ile ilgili birçok örnek bulabilirsiniz. Gamelan'da (JavaScript kısmında) birçok
adres mevcut durumdadır. Netscape'de
ise JavaScript ile ilgili ayrıntılı döküman bulabilirsiniz.
Hernekadar Adları birbirinin nerdeyse aynısı olsa da Java ile
JavaScript aynı şeyler değildir. Java bir programlama dilidir, JavaScript
ise bir scripttir(Adından anlaşıldığı gibi). Farkları ise; Java ile gerçek
programlar yazarsınız. Ancak sayfanızda daha çok program yazmakla
uğraşmadan güzel şeyler yaratmak istediğinizden Java çok
yaygınlaşmamıştır. JavaScript yazarlarının
programlamaya dikkat etmelerine fazla gerek yoktur. JavaScript, ayrı bir
programlama dilinden çok HTML'nin bir uzantısıdır denebilir. Tabii ki bu
'resmi' bir tanımlama değil, ama Java ve JavaScript arasındaki farkı
anlatmak için iyi bir tanımlamadır.
Hem Java, hem de JavaScript hakkındaki
daha ayrıntılı açıklamayı
http://www.gamelan.com adresinden alabilirsiniz.
JavaScript'i destekleyen ilk alıcı Netscape Navigator 2.0 idi. Tabii ki
daha üst versiyonlar da destekliyor. Java'nın ise tüm Netscape Navigator
2.0 ve üst versiyonlarında çalışmadığını biliyorsunuzdur. Her ne kadar
değişik versiyonlarda bazı problemler olsa da JavaScript'i tüm Netscape
ailesi destekleyecektir. Yakın gelecekte tüm alıcılar JavaScript'i
destekleyeceklerdir. Örneğin yakında çıkacak olan Microsoft Internet
Explorer 3.0 JavaScript'i destekleyecektir. Yani JavaScript'i destekleyen
alıcılar gelecekte çok yaygın olacağından bu tekniği şimdiden öğrenmek
faydalı olacaktır. Gördükçe anlayacaksınız ki JavaScript scriptleri yazmak
gerçekten de kolaydır. Size gereken sadece birkaç ana teknik ve
çevrenizde aynı konuyla uğraşan, bilgi alışverişi yapabileceğiniz
kişilerden ibaret olacaktır.
Eğer JavaScript'i destekleyen bir alıcı kullanıyorsanız bu scripti
çalışırken görebilirsiniz. Eğer alıcınız JavaScript'i desteklemiyorsa bu
çıktı biraz acaip görünebilir.
Bu normal bir HTML dökümanıdır.
Bu script'in pek de yararlı olduğunu söyleyemeyeceğim. Aynı şeyi
HTML komutları ile çok daha hızlı ve kısa yazabilirsiniz. Bu örnekle size
asıl göstermek istediğim <script> komutu idi. Bu komutu dökümanınızın
herhangibir yerinde kullanabilirsiniz.
Bu script bir düğme yaratacaktır ve bu düğmeye bastığınızda bir
'Selam!' yazan bir pencere oluşacaktır. Ne muhteşem değil mi? Peki bu
scriptte neler oluyor? Öncelikle fonksiyon alıcı tarafından okunur ve
bilgisayarın hafızasında tutulur. Daha sonra normal 'HTML' dilindeki
<FORM> komutuyla düğme yaratılır. Ancak bu düğmede yeni birşey
görmektesiniz: 'onClick' . Bu yazı alıcınıza tuşa
basıldığında hangi fonksiyonu çağıracağını söyler(Tabii eğer alıcınız
JavaScript'i destekliyorsa). 'dugmebas()' fonsiyonu <HEAD> komutları
arasında tanımlanmıştı. Böylece düğmeye basınca fonksiyon
gerçekleştirildi. Bu script'te yeni birşey daha var: 'alert'(Uyarı). Bu
metod JavaScript'te
zaten mevcut olduğundan size sadece onu çağırmak kalmıştır. Bunun gibi
birçok metod Netscape'in sitesinde
(http://www.gazi.edu.tr/~ozan/javascript adresinde bir kopyası
var)bulunmaktadır. Ben burada sadece birkaçını göstereceğim.
Bu script'te de yeni bazı elemanlar kullandık. İlk başta bir yorum
yerleştirdik ki eski alıcılar script'i okumaya çalışmasın. Bu satırlardaki
boşluklar ve yazıların yerleştirildiği yerler önemlidir. Yanlış yazarsanız
bu script'iniz JavaScript destekli alıcılarda hata mesajı yaratır.
<input> komutları arasındaki 'onBlur' komutu bilgisayara forma bilgi
girildiğinde hangi fonksiyonu çağıracağını söyler. Formu doldurup 'enter'
tuşuna bastığınızda ya da fareyi dışarıda biryere tıkladığınızda
'adoku(str)' fonksiyonu çağrılır. Fonksiyon da 'adoku(this.value)' komutu
ile forma girdiğiniz bilgiyi alır. 'this.value'(bu.değer) bu forma
girdiğiniz değer anlamına gelir.
Aslında şu anda bu fonksiyon tüm makinalarda düzgün çalışmıyor. Bazı
'server'lar sadece 1/1/1970 tarihini gösteriyor. Bu fonksiyonla ilgili bir
problem var sanırım. Bu fonksiyonun tam olarak çalıştığını görebilmek için
JavaScript dilinin yenilenmesini bekleyeceğiz sanırım. Ancak siz yine de
bu script'i kendi makinanızda bir deneyin. Çünkü doğru olarak çalıştığı
makinalarda bulunmaktadır.
Daha önce de söylediğim gibi Internet dünyası hızla gelişmektedir. Yani
gelecek hafta JavaScript'te aniden büyük bir değişiklik olursa hiç
şaşırmayın! Bu da demektir ki her zaman için olabilecek değişiklikleri
takip
etmelisiniz. Eğer burada size anlattığım şeyler değişirse lütfen anlayışla
karşılayın fakat yine de ana mantığın değişeceğini hiç sanmıyorum.
Java ve JavaScript Arasındaki Farklar Nelerdir?
JavaScript scriptlerini Çalıştırmak
Tabii ki JavaScript öğrenebilmeniz için öncelikle HTML hakkında bilgi
sahibi olmanız gereklidir. HTML hakkında Internet'te birçok kaynak
mevcuttur. Yahoo arama servisinde 'html' konu
başlığını ararsanız pek çok kaynak bulabilirsiniz.(Bu kaynaklar piyasadaki
kitaplardan çok daha faydalıdır çünkü sürekli
güncellenmektedirler. Internet'in büyüme hızına başka türlü yetişmeniz
biraz zor.)
Şimdi size bazı ufak scriptler göstermek istiyorum. Böylelikle bu yeni
script dilinin HTML dökümanlarında nasıl kullanıldığını ve bu dille neler
yapabileceğinizi görebilirsiniz. Ben, HTML dökümanına sadece normal bir
yazı yazan çok küçük bir scriptle başlamak istiyorum.
<html>
<head>
İlk yazdığım JavaScript!
</head>
<body>
<br>
Bu normal bir HTML dökümanıdır.
<br>
<script language="JavaScript">
document.write("İşte JavaScript!")
</script>
<br>
HTML'ye dönüş.
</body>
</html>
HTML'ye dönüş.
Sizi saçma scriptlerle sıkmak istediğimden fonksiyonlara geçmek
istiyorum. Bu da anlaşılması zor bir şey değildir fakat inanın bana, çok
daha faydalıdır. Fonksiyonlar kullanıcının yaptığı hareketlerle işlev
kazanır ve <HEAD> komutları arasına yazılırsa daha iyi olur. Bu komut
sayfada okunan ilk yer olduğundan fonksiyonları buraya
yerleştirmek gayet mantıklıdır. Böylece kullanıcı fonksiyon çağıracak bir
harekette bulunamadan önce fonksiyonlar tanımlanmış olur. Scriptler ise
HTML dilinde sayfada görünmeyen, sadece sayfanın kayanağında(Document
Source)görülen 'yorum' satırlarının içine yazılır. Böylece JavaScript'i
desteklemeyen alıcılar scriptle ilgili kısımları yorum olarak düşünür ve
hata mesajı ya da garip şekiller yaratmazlar.
<html>
<head>
<script language="JavaScript">
<!-- Eski alıcılardan scripti saklamak için
function dugmebas() {
alert("Selam!");
}
// Yorum komutunun kapanması -->
</script>
</head>
<body>
<form>
<input type="button" name="Button1" value="Bana Basın" onclick="dugmebas()">
</form>
</body>
</html>
Eğer bu örneği heman şimdi test etmek istiyorsanız ve JavaScript'i
destekleyen bir alıcınız varsa lütfen aşağıdaki düğmeye basın.
Biraz ilerleme kaydettik sayılır. Aslında şu anda sadece scriptlerimize
fonksiyon ekleyerek yapabileceğimiz birçok işe yarar şey var. Şimdi size
kullanıcının forma yazdığı şeyleri nasıl okuyacağınızı göstereceğim.
<html>
<head>
<script language="JavaScript">
<!-- Eski alıcılardan scripti saklayalım
function adoku(str) {
alert("Merhaba "+ str+"!");
}
// saklama işlemini sona erdirelim -->
</script>
</head>
<body>
Adınız:
<form>
<input type="text" name="name" onBlur="adoku(this.value)" value="">
</form>
</body>
</html>
Şimdi bu scripti test edebilirsiniz:
Adınız:
Sanırım şimdi vereceğim özellik ilginizi çekecektir. Script'imize tarih
fonksiyonu yerleştireceğiz. Böylece yarattığınız HTML sayfasının en son
değiştirildiği tarihi otomatik olarak yazdırabilir ve herseferinde
sayfanıza tarih atmak zorunda kalmazsınız. Basit bir script
yazarsınız ve gelecekte sayfada değişiklik yaptığınızda tarih otomatik
olarak değişecektir.
<html>
<body>
Basit Bir HTML - Sayfası.
<br>
Son Değişiklikler:
<script language="JavaScript">
<!-- Eski alıcılardan script'i saklayalım
document.write(document.lastModified)
// Yorum komutunun kapatılması -->
</script>
</body>
</html>
11.Mayıs'96
© 1996 - Stefan Koch