JavaScript Nereye
<script> Etiketi
<script>HTML'de JavaScript kodu ve </script>etiketleri arasına eklenir .
Örnek
<script>
document.getElementById("demo").innerHTML = "My First JavaScript";
</script>
Eski JavaScript örnekleri, bir tür niteliği kullanabilir: <script type="text/javascript">.
type özelliği gerekli değildir. JavaScript, HTML'deki varsayılan komut dosyası dilidir.
JavaScript İşlevleri ve Olayları
JavaScript function, "çağrıldığında" çalıştırılabilen bir JavaScript kodu bloğudur.
Örneğin, kullanıcının bir düğmeyi tıklaması gibi bir olay meydana geldiğinde bir işlev çağrılabilir .
Sonraki bölümlerde işlevler ve olaylar hakkında çok daha fazlasını öğreneceksiniz.
<head> veya <body> içinde JavaScript
Bir HTML belgesine istediğiniz sayıda komut dosyası yerleştirebilirsiniz.
Komut dosyaları, bir HTML sayfasının bölümüne <body>veya bölümüne veya her ikisine birden yerleştirilebilir.<head>
<head> içindeki JavaScript
Bu örnekte, bir HTML sayfasının bölümüne bir JavaScript functionyerleştirilmiştir .<head>
Bir düğmeye tıklandığında işlev çağrılır (çağrılır):
Örnek
<!DOCTYPE html>
<html>
<head>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed.";
}
</script>
</head>
<body>
<h2>Demo JavaScript in Head</h2>
<p id="demo">A Paragraph</p>
<button type="button" onclick="myFunction()">Try
it</button>
</body>
</html>
<body> içindeki JavaScript
Bu örnekte, bir HTML sayfasının bölümüne bir JavaScript functionyerleştirilmiştir .<body>
Bir düğmeye tıklandığında işlev çağrılır (çağrılır):
Örnek
<!DOCTYPE html>
<html>
<body>
<h2>Demo JavaScript in Body</h2>
<p id="demo">A Paragraph</p>
<button type="button" onclick="myFunction()">Try
it</button>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed.";
}
</script>
</body>
</html>
Komut dosyalarının <body> öğesinin altına yerleştirilmesi görüntüleme hızını artırır, çünkü komut dosyası yorumlama ekranı yavaşlatır.
Harici JavaScript
Komut dosyaları ayrıca harici dosyalara da yerleştirilebilir:
Harici dosya: myScript.js
function myFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed.";
}
Aynı kod birçok farklı web sayfasında kullanıldığında harici komut dosyaları pratiktir.
JavaScript dosyaları .js dosya uzantısına sahiptir .
Harici bir komut dosyası kullanmak için komut dosyasının adını bir etiketin src(kaynak) özniteliğine girin:<script>
Örnek
<script src="myScript.js"></script>
Harici bir komut dosyası referansını istediğiniz gibi <head>veya içine yerleştirebilirsiniz.<body>
<script>Komut dosyası, tam olarak etiketin bulunduğu yerdeymiş gibi davranacaktır .
<script>Harici komut dosyaları etiket içeremez .
Harici JavaScript Avantajları
Komut dosyalarını harici dosyalara yerleştirmenin bazı avantajları vardır:
- HTML ve kodu ayırır
- HTML ve JavaScript'in okunmasını ve bakımını kolaylaştırır
- Önbelleğe alınmış JavaScript dosyaları sayfa yüklemelerini hızlandırabilir
Bir sayfaya birkaç komut dosyası eklemek için - birkaç komut dosyası etiketi kullanın:
Örnek
<script src="myScript1.js"></script>
<script src="myScript2.js"></script>
Dış Referanslar
Harici bir komut dosyasına 3 farklı şekilde başvurulabilir:
- Tam URL ile (tam web adresi)
- Bir dosya yolu ile (/js/ gibi)
- herhangi bir yol olmadan
Bu örnek, myScript.js'ye bağlanmak için tam bir URL kullanır:
Örnek
<script src="https://www.w3schools.com/js/myScript.js"></script>
Bu örnek, myScript.js'ye bağlanmak için bir dosya yolu kullanır:
Örnek
<script src="/js/myScript.js"></script>
Bu örnek, myScript.js'ye bağlanmak için yol kullanmaz:
Örnek
<script src="myScript.js"></script>
Dosya yolları hakkında daha fazla bilgiyi HTML Dosya Yolları bölümünde okuyabilirsiniz .