JavaScript kann in platziert werden <body> und der <head> Teile einer HTML - Seite.
Das <script> Tag
In HTML müssen JavaScript - Code zwischen eingefügt <script> und </script> Tags.
Beispiel
<script>
document.getElementById("demo").innerHTML = "My First JavaScript";
</script>
Ältere Beispiele können ein type - Attribut verwenden: <script type="text/javascript"> .
Diese Art Attribut ist nicht erforderlich. JavaScript ist die Standard-Skriptsprache in HTML.
JavaScript-Funktionen und Events
Eine JavaScript - function ist ein Block von JavaScript - Code, die ausgeführt werden können , wenn "gebeten" zu.
Beispielsweise kann eine Funktion ausgeführt werden , wenn einEreignis eintritt, wie wenn der Benutzer auf eine Schaltfläche klickt.
Sie werden viel mehr über Funktionen und Ereignisse in späteren Kapiteln lernen.
JavaScript in <head> oder <body>
Sie können in einem HTML-Dokument eine beliebige Anzahl von Skripten platzieren.
Skripte können in der platziert werden <body> oder im <head> Abschnitt einer HTML - Seite oder in beiden.
Halten Sie den gesamten Code an einem Ort, ist immer eine gute Gewohnheit.
JavaScript in <head>
In diesem Beispiel wird eine JavaScript - Funktion in der platziert <head> Abschnitt einer HTML - Seite.
Die Funktion wird aufgerufen (genannt), wenn eine Schaltfläche geklickt wird:
Beispiel
<!DOCTYPE html>
<html><head>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed.";
}
</script>
</head>
<body>
<h1>My Web Page</h1>
<p id="demo">A Paragraph</p>
<button type="button" onclick="myFunction()">Try
it</button>
</body>
</html>
Versuch es selber " JavaScript in <body>
In diesem Beispiel wird eine JavaScript - Funktion in der platziert <body> Abschnitt einer HTML - Seite.
Die Funktion wird aufgerufen (genannt), wenn eine Schaltfläche geklickt wird:
Beispiel
<!DOCTYPE html>
<html>
<body>
<h1>My Web Page</h1>
<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>
Versuch es selber " Es ist eine gute Idee um Skripte am unteren Rand des <body> Element.
Dies kann Laden der Seite zu verbessern, weil Skriptkompilierung die Anzeige verlangsamen kann.
Externe JavaScript
Skripte können auch in externen Dateien abgelegt werden:
MyScript.js
function myFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed.";
}
Externe Skripte sind praktisch, wenn der gleiche Code in vielen verschiedenen Web-Seiten verwendet wird.
JavaScript - Dateien haben die Dateierweiterung .js .
Um ein externes Skript zu verwenden, setzen Sie den Namen der Skriptdatei im src (Quelle) Attribut eines <script> tag:
Beispiel
<!DOCTYPE html>
<html>
<body>
<script src="myScript.js"></script>
</body>
</html> Versuch es selber " Sie können ein externes Skript Referenz in platzieren <head> oder <body> , wie Sie möchten.
Das Skript wird sich verhalten , als ob es genau gelegen war , wo die <script> Tag befindet.
Externe Skripte können nicht enthalten <script> Tags.
Externe JavaScript Vorteile
Platzieren von JavaScripts in externe Dateien hat einige Vorteile:
- Er trennt HTML und Code
- Es macht HTML und JavaScript leichter zu lesen und zu pflegen
- Cached JavaScript-Dateien können bis Seite geladen Geschwindigkeit