Verwendung von JavaScript

<script>-Tag

In HTML muss JavaScript-Code in <script> mit </script> zwischen den Tags.

Beispiel

<script>
document.getElementById("demo").innerHTML = "mein erstes JavaScript";
</script>

persönlich ausprobieren

Anmerkung:verwenden Alte JavaScript-Beispiele könnten type

Anmerkung:Attribut: <script type="text/javascript">.

Das Attribut type ist nicht erforderlich. JavaScript ist das Standard-Skript-Sprache in HTML.

JavaScript-Funktionen und Ereignisse JavaScriptFunktion

ist ein JavaScript-Codeblock, der ausgeführt wird, wenn er aufgerufen wird.Beispielsweise, wennEreignisse

Hinweis:Funktionen aufgerufen werden, wie z.B. wenn der Benutzer auf einen Button klickt.

Sie werden in den folgenden Kapiteln mehr über Funktionen und Ereignisse lernen.

<head> oder <body> der JavaScript

Sie können so viele Skripte wie Sie möchten in einem HTML-Dokument platzieren. <body> oder <head> Das Skript kann in den

Teil im

In diesem Beispiel wird die JavaScript-Funktion im <head> Teil.

Diese Funktion wird aufgerufen, wenn der Button geklickt wird:

Beispiel

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction() {
    document.getElementById("demo").innerHTML = "Der Abschnitt wurde geändert.";
}
</script>
</head>
<body>
<h1>Eine Webseite</h1>
<p id="demo">Ein Abschnitt</p>
<button type="button" onclick="myFunction()">Versuchen Sie es</button>
</body>
</html>

persönlich ausprobieren

<body> der HTML-Seite platziert.

In diesem Beispiel wird die JavaScript-Funktion im <body> Teil.

Diese Funktion wird aufgerufen, wenn der Button geklickt wird:

Beispiel

<!DOCTYPE html>
<html>
<body> 
<h1>Eine Webseite</h1>
<p id="demo">Ein Abschnitt</p>
<button type="button" onclick="myFunction()">Versuchen Sie es</button>
<script>
function myFunction() {
   document.getElementById("demo").innerHTML = "Der Abschnitt wurde geändert.";
}
</script>
</body>
</html>

persönlich ausprobieren

Hinweis:Platzieren Sie das Skript <body> am Ende des Elements platziert werden, um die Anzeige zu verbessern, da die Skript-Kompilierung die Anzeige verlangsamen kann.

Externe Skripte

Das Skript kann in der externen Datei platziert werden:

Externer Datei: myScript.js

function myFunction() {
   document.getElementById("demo").innerHTML = "Der Abschnitt wurde geändert.";
}

Externe Skripte sind nützlich, wenn dasselbe Skript auf vielen verschiedenen Webseiten verwendet wird.

Die Dateierweiterung für JavaScript-Dateien ist .js。

Um externe Skripte zu verwenden, geben Sie <script> Attribut des src im (source) Attribut den Namen des Skripts festlegen:

Beispiel

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

persönlich ausprobieren

Sie können <head> oder <body> und wo externe Skript-Referenzen platziert werden.

Die Darstellung des Skripts hängt davon ab, wo es platziert wird <script> Der Inhalt ist im <script>-Tag identisch.

Anmerkung:Externe Skripte dürfen keine Kommentare enthalten <script> Schlüsselwörter.

Vorteile der externen JavaScript

Die Vorteile der Skripte in externen Dateien sind:

  • Trennt HTML und Code
  • Macht HTML und JavaScript lesbarer und unterhaltsamer
  • Vorgecachte JavaScript-Dateien können die Ladezeit der Seite beschleunigen

Um mehreren Skriptdateien auf einer Seite hinzuzufügen - verwenden Sie mehrere script-Tags:

Beispiel

<script src="myScript1.js"></script>
<script src="myScript2.js"></script>

Externe Referenz

Externe Skripte können durch eine vollständige URL oder einen relativen Pfad zur aktuellen Webseite referenziert werden:

Dieser Beispiel verwendet eine vollständige URL, um auf das Skript zu verweisen:

Beispiel

<script src="https://www.codew3c.com/js/myScript1.js"></script>

persönlich ausprobieren

Dieser Beispiel verwendet ein Skript aus einem bestimmten Ordner auf der aktuellen Website:

Beispiel

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

persönlich ausprobieren

Dieser Beispiel verlinkt zu einem Skript im selben Ordner wie die aktuelle Seite:

Beispiel

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

persönlich ausprobieren

Sie können HTML-DateipfadLernen Sie mehr über Dateipfade.