Bu kılavuz, JavaScript'i bir HTML dosyasına yerleştirme yaklaşımlarını gösterecektir.
JavaScript'i bir HTML dosyasında nereye yerleştirmeli?
JavaScript'in bir HTML dosyasına yerleştirilmesi şu şekilde olabilir:
Yaklaşım 1: JavaScript'in HTML dosyasındaki Etiketi İçine Yerleştirilmesi
Bu yaklaşımda, kodun JavaScript kısmının “
Örnek vermek
Aşağıda verilen gösterime genel bir bakış atalım:
< kafa >
< komut dosyası türü = 'metin/javascript' >
işlev yerleşimiJ'ler ( ) {
uyarmak ( 'JavaScript yerleşimi etiketi içinde' )
}
senaryo >
kafa >
< gövde >
< merkez >< tıklama düğmesi = 'yerleşimJs()' > Beni tıkla buton > merkez >
gövde >
Yukarıdaki kod parçacığında:
- Kodun JavaScript kısmını “
” yardımıyla etiketleyin. ' etiket. - JS kodunda “adlı bir işlev tanımlayın. yerleşimJs() ”. Tanımında, belirtilen mesajı uyarı iletişim kutusu aracılığıyla görüntüleyin.
- Son olarak, HTML kodunda “ tıklamada ” butonu tıklandığında bir önceki adımda tanımlı fonksiyona yönlendirecek olay.
Çıktı
Yukarıdaki çıktıda JS kodunun “” içerisine yerleştirilerek düzgün çalıştığı görülmektedir.
Yaklaşım 2: JavaScript'in HTML dosyasındaki Etiketi İçine Yerleştirilmesi
Bu yaklaşımda, JavaScript kodunun “
Örnek vermek
Aşağıda verilen örnek, belirtilen kavramı göstermektedir:
< gövde >< merkez >< tıklama düğmesi = 'yerleşimJs()' > Beni tıkla buton > merkez >
< komut dosyası türü = 'metin/javascript' >
işlev yerleşimiJ'ler ( ) {
uyarmak ( 'JavaScript yerleşimi etiketi içinde' )
}
senaryo >
gövde >
Yukarıdaki kod satırlarında:
- İçinde '
” etiketi, aynı şekilde, “ yardımıyla placeJs() işlevini çağıran bir düğme oluşturur. tıklamada ' Etkinlik. - JavaScript kod bloğunda, “adlı bir işlev bildirin. yerleşimJs() ”.
- Bu işlev, düğme tıklandığında çağrılır ve belirtilen mesajı bir uyarı aracılığıyla görüntüler.
Çıktı
Yaklaşım 3: JavaScript'in Harici bir dosya olarak yerleştirilmesi
Bu özel yaklaşım, bir JavaScript kod bloğunun '' uzantılı belirli bir dosya adına sahip harici bir JS dosyası olarak yerleştirilmesini içerir. .js ' içinde ' kaynak ' bağlanmak.
Örnek vermek
Aşağıdaki örneği inceleyelim:
< gövde >< merkez >< tıklama düğmesi = 'yerleşimJs()' > Beni tıkla buton > merkez >
gövde >
< komut dosyası türü = 'metin/javascript' kaynak = harici dosya js > senaryo >
Yukarıdaki HTML kodunda:
- JavaScript işlevine yeniden yönlendiren bir düğme oluşturmak için tartışılan yaklaşımı hatırlayın ' yerleşimJs() ”.
- Bundan sonra, JavaScript işlevlerini '' bölümünde belirtilen dosya adıyla bağlantılı harici bir JS dosyası yardımıyla entegre edin. kaynak ' bağlanmak.
Aşağıda verilen JS koduna geçelim:
işlev yerleşimiJ'ler ( ) {uyarmak ( 'Bu harici bir JavaScript dosyasıdır' )
}
Yukarıdaki kod bloğunda:
- “ adlı bir işlev tanımlayın. yerleştirmeJS() ”.
- Tanımında butona tıklandığında belirtilen mesajı uyarı ile gösterir.
- Bu yaklaşım sonuçta hem HTML hem de JavaScript dosyalarını gömerek aynı sonucu verecektir.
Çıktı
JavaScript'i bir HTML dosyasına yerleştirmeyle ilgili gerçek bilgiler sunduk.
Çözüm
JavaScript'in bir HTML dosyasına yerleştirilmesi “