JavaScript Nerede Kullanılır?

<script> Etiketi

HTML’de, <script> ve </script> etiketleri arasına JavaScript kodu girilmelidir.

Örnek:

<html>
<body>
<h2>JavaScript </h2>
<p id=”demo”></p>
<script>
document.getElementById(“demo”).innerHTML = “Benim ilk JavaScript’im”;
</script>
</body>
</html>

JavaScript İşlevleri ve Olayları

Bir JavaScript işlevi, “çağrıldığında” çalıştırılabilen bir JavaScript kodu bloğudur.

Örneğin, bir olay gerçekleştiğinde, kullanıcı bir düğmeyi tıkladığında olduğu gibi bir işlev çağrılabilir.

<head> veya <body> içindeki JavaScript

Bir HTML belgesine istediğiniz sayıda komut dosyası ekleyebilirsiniz.

Komut dosyaları <body> veya bir HTML sayfasının <head> bölümüne veya her ikisine de yerleştirilebilir.

<head> içerisinde JavaScript

Bu örnekte, bir HTML sayfasının <head> bölümüne bir JavaScript işlevi yerleştirilmiştir.

Bir düğmeye tıklandığında işlev çağrılır (çağrılır):

örnek:

<!DOCTYPE html>
<html>

<head>
<script>
function Islev() {
  document.getElementById(“demo”).innerHTML = “Paragraf değiştir.”;
}
</script>
</head>
<body>

<h1>Web Sayfası</h1>
<p id=”demo”>Paragraf</p>
<button type=”button” onclick=”Islev()”>Dene</button>

</body>
</html>

<body> içerisinde JavaScript

Bu örnekte, bir HTML sayfasının <body> bölümüne bir JavaScript işlevi yerleştirilmiştir.

Bir düğmeye tıklandığında işlev çağrılır:

Örnek:

<!DOCTYPE html>
<html>
<body> 

<h1>Web Sayfası</h1>
<p id=”demo”>Paragraf</p>
<button type=”button” onclick=”Islev()”>Dene</button>

<script>
function Islev() {
 document.getElementById(“demo”).innerHTML = “Paragraf değiştir.”;
}
</script>

</body>
</html>

Harici JavaScript

Komut dosyaları harici dosyalara da yerleştirilebilir:

External file: myScript.js

function Islev() {
 document.getElementById(“demo”).innerHTML = “Paragraf değiştir.”;
}

Harici kodlar, aynı kod birçok farklı web sayfasında kullanıldığında pratiktir.

JavaScript dosyaları .js dosya uzantısına sahiptir.

Harici bir komut dosyası kullanmak için, komut dosyası dosyasının adını bir <script> etiketinin src (kaynak) özniteliğine yerleştirin:

<html>

<body>

<h2>Harici JavaScript</h2>

<p id=”demo”>Paragraf.</p>

<button type=”button” onclick=”Islev()”>Dene</button>

<p>(Islev “myScript.js” adı verilen harici bir dosyada saklanır)</p>

<script src=”myScript.js”></script>

</body>

</html>

Harici bir komut dosyası referansını istediğiniz gibi <head> veya <body> içine yerleştirebilirsiniz.

Komut tam olarak <script> etiketinin bulunduğu yerdeymiş gibi davranır.

Harici JavaScript’in Avantajları

Komut dosyalarını harici dosyalara yerleştirmenin bazı avantajları vardır:

  • HTML’yi 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üklenmelerini 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>

Harici Referanslar

Harici komut dosyalarına, tam bir URL ile veya geçerli web sayfasına göre bir yolla başvurulabilir.

Bu örnek bir komut dosyasına bağlanmak için tam bir URL kullanır:

Örnek

<script src=”https://www.w3schools.com/js/myScript1.js”></script>

Bu örnek, geçerli web sitesinde belirtilen bir klasörde bulunan bir komut dosyasını kullanır:

Örnek

<script src=”/js/myScript1.js”></script>

Bu örnek, geçerli sayfayla aynı klasörde bulunan bir komut dosyasına bağlantı verir:

Örnek

<script src=”myScript1.js”></script>