JAVASCRIPT DERSLERİ ANASAYFA ÖNCEKİ DERS SIRADAKİ DERS
Konu başlığına tıklayarak detayları görebilirsiniz!!!
İlk olarak Javacsript kodlarının HTML belgesi içerisine nasıl dahil edileceğini bilmemiz gerekiyor. Bu konuya başlayabilmeniz için en azından temel HTML bilgisine sahip olmanız veya daha önceden derslerimiz arasında bulunan HTML ile ilgili kısımdaki dersleri bitirmiş olmanız gerekmektedir.
Daha önce HTML derslerinde öğrendiğimiz üzere etiketler yardımıyla Javascript işlemlerimizi HTML içerisine ekleyebiliriz. Temel olarak Javascript kodları 2 şekilde HTML dosyaları içerisine dahil edilebilir.
Birincisi aşağıdaki şekilde, kodların tamamının <script></script> etiketleri arasında yazılmasıdır. Bu durumda sadece ilgili html belgesinde o javascript kodları direk olarak kullanılabilir. Başka bir html belgesi içinde kullanamayız. Etiketleri (tagleri) <head></head> etiketleri arasına yazabiliriz. Notepad++ programını açıp aşağıdaki kodları içerisine yazıyoruz/kopyalıyoruz. Sonrasında kaydet diyoruz, seçeneklerden HTM (Hyper Text Markup Language) olarak kaydet diyoruz ve bilgisayarımızda istediğimiz bir yere kaydediyoruz. Ben javascipt.html adıyla kaydettim. HTML olarak kaydettiğinize emin olduktan sonra kodumuzu çalıştırmak için tek yapmanız gereken oluşturduğunuz dosyaya çift tıklamak olacaktır. Çift tıkladığınızda sisteminize tanımlamış olduğunuz tarayıcıda (browser) kodumuzun bir internet sayfası gibi çalıştığını göreceksiniz.
<html>
<head>
<script type="text/javascript">
document.write ("Sayfamıza hoşgeldiniz");
</script>
</head>
<body>
</body>
</html>
Javascript'te ekrana birşey yazdırmak için document.write komutunu kullanıp, yazdırmak istediğimiz kelimeyi, veya cümleyi tırnak içerisinde belirtiyoruz. Buradaki kullanımımız doğrultusunda Sayfamıza hoşgeldiniz yazısı bizi karşılayacaktır.Aynı işmei html kullanarak da yazabilirdik ama Javascript'te bir giriş örneği olması açısından bu şekilde bir kullanım gerçekleştirdik.
TARAYICI (BROWSER) EKRAN GÖRÜNTÜSÜ:
İkinci yöntem ise kodların harici .js uzantılı bir dosyadan alınmasıdır. Bu noktada ilgili .js uzantılı dosyayı referans göstermemiz gerekiyor .html dosyamız içerisinde. Bu .js dosyası içerisinde yaptığımız her değişiklik referans gösterdiğimiz her .html sayfasında da uygulanmış oluyor. Farklı .html sayfalarında kullanacağımız javascript işlemleri için bu yöntem daha uygun ve pratiktir.
<!DOCTYPE html> <html> <head> <script type= "text/javascript" src="js/jquery.min.js"></script> <meta charset="utf-8"> <title>Sayfa Başlığı</title> </head> <body> </body> </html>
Bu kullanım bir kalıptır. CSS derslerinde gösterdiğimiz gibi aynı şekilde javascript için de bu kalıbın tamamı ile böyle kullanılması gerekmektedir. Örnekte projemizin js klasörü içerisinde jquery.min.js uzantılı bir dosya olduğunu göstermiş olduk. Bu javascript dosyası içindeki önceden tanımlamış olduğumuz her türlü fonksiyon, değişken, liste türü elemanlara referans gösterdiğimiz her .html dosyası içerisinden ulaşabilme imkanını sağlamış olduk.
1- Kod blokları arasına açıklama satırları (comment line) eklenebilir. Bu satırlar işlem yapmaz ve görmezden gelinirler. Sadece not düşme gibi daha sonra hatırlamak istediğiniz birşeyi yazmak için kullanılabilir.
Tek açıklama satırı eklemek için çift slash (çift eğik çizgi) // işareti kullanılır:
// Bu bir açıklama satırıdır
Çoklu açıklama satırı eklemek için slash (eğik çizgi) ve yıldız /* Açıklama */ kullanılır:
/* Açıklama Satırı 1
Açıklama Satırı 2 */
2- Javascript'te her komut satırı noktalı virgül ; ile bitmelidir. Yoksa herhangi bir işlevi olmaz ve hata alırsınız.
<script>
var a = 1; // örneğimizdeki şekilde değişken tanımlayıp noktalı virgül ile bitiriyoruz.
</script>
