JavaScript dokąd
Tag <script>
W HTML kod JavaScript jest wstawiany między tagami <script>i .</script>
Przykład
<script>
document.getElementById("demo").innerHTML = "My First JavaScript";
</script>
Stare przykłady JavaScript mogą używać atrybutu type: <script type="text/javascript">.
Atrybut typu nie jest wymagany. JavaScript jest domyślnym językiem skryptowym w HTML.
Funkcje i zdarzenia JavaScript
JavaScript functionjest blokiem kodu JavaScript, który może zostać wykonany, gdy zostanie "wezwany".
Na przykład funkcję można wywołać, gdy wystąpi zdarzenie , na przykład gdy użytkownik kliknie przycisk.
Dużo więcej o funkcjach i zdarzeniach dowiesz się w kolejnych rozdziałach.
JavaScript w <head> lub <body>
W dokumencie HTML możesz umieścić dowolną liczbę skryptów.
Skrypty można umieszczać w <body>, <head>sekcji strony HTML lub w obu.
JavaScript w <head>
W tym przykładzie kod JavaScript functionjest umieszczony w <head>sekcji strony HTML.
Funkcja jest wywoływana (wywoływana) po kliknięciu przycisku:
Przykład
<!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>
JavaScript w <body>
W tym przykładzie kod JavaScript functionjest umieszczony w <body>sekcji strony HTML.
Funkcja jest wywoływana (wywoływana) po kliknięciu przycisku:
Przykład
<!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>
Umieszczenie skryptów na dole elementu <body> poprawia szybkość wyświetlania, ponieważ interpretacja skryptów spowalnia wyświetlanie.
Zewnętrzny JavaScript
Skrypty można również umieszczać w plikach zewnętrznych:
Plik zewnętrzny: myScript.js
function myFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed.";
}
Skrypty zewnętrzne są praktyczne, gdy ten sam kod jest używany na wielu różnych stronach internetowych.
Pliki JavaScript mają rozszerzenie .js .
Aby użyć zewnętrznego skryptu, umieść nazwę pliku skryptu w srcatrybucie (źródło) <script>znacznika:
Przykład
<script src="myScript.js"></script>
Możesz umieścić odwołanie do skryptu zewnętrznego w <head>lub <body>w dowolny sposób.
Skrypt będzie się zachowywał tak, jakby znajdował się dokładnie tam, gdzie <script>znajduje się tag.
Skrypty zewnętrzne nie mogą zawierać <script>tagów.
Zewnętrzne zalety JavaScript
Umieszczanie skryptów w plikach zewnętrznych ma kilka zalet:
- Oddziela HTML i kod
- Ułatwia czytanie i obsługę HTML i JavaScript
- Buforowane pliki JavaScript mogą przyspieszyć ładowanie stron
Aby dodać kilka plików skryptów do jednej strony - użyj kilku tagów skryptu:
Przykład
<script src="myScript1.js"></script>
<script src="myScript2.js"></script>
Odniesienia zewnętrzne
Do skryptu zewnętrznego można się odwoływać na 3 różne sposoby:
- Z pełnym adresem URL (pełnym adresem internetowym)
- Ze ścieżką do pliku (np. /js/)
- Bez żadnej ścieżki
Ten przykład używa pełnego adresu URL do linku do myScript.js:
Przykład
<script src="https://www.w3schools.com/js/myScript.js"></script>
W tym przykładzie użyto ścieżki pliku do linku do myScript.js:
Przykład
<script src="/js/myScript.js"></script>
Ten przykład nie używa ścieżki do linku do myScript.js:
Przykład
<script src="myScript.js"></script>
Możesz przeczytać więcej o ścieżkach plików w rozdziale Ścieżki plików HTML .