HTML `<script>`-Tag

Das HTML <script>-Tag deklariert clientseitigen Code (JavaScript) in einem HTML-Dokument. Bei der Definition von clientseitigem Code wird das <script>-Tag für Bildmanipulationen, Formularvalidierung und dynamische Inhaltsänderungen verwendet. Das Tag kann entweder den Code selbst enthalten oder auf eine externe Datei verweisen, die Skripte enthält. Der Pfad zur externen Datei wird mit dem Attribut src angegeben.

DANGER

Wenn Sie eine externe Datei mit Skripten einbinden, fügen Sie keinen weiteren Skriptcode in dasselbe <script>-Tag ein.

Das HTML <script>-Tag kann im <head>-Element sowie im <body>-Element platziert werden. Skripte, die zuerst ausgeführt werden müssen, werden häufig mit defer im <head>-Element oder am Ende des <body>-Elements platziert. Das <script>-Tag kann in einem HTML-Dokument mehrfach verwendet werden.

script tag example

Syntax

Das <script>-Tag wird paarweise verwendet. Der Inhalt wird zwischen dem öffnenden (<script>) und dem schließenden (</script>)-Tag geschrieben.

Wichtige Hinweise

Es gibt mehrere Möglichkeiten, wie ein externes Skript ausgeführt werden kann:

Standardmäßig (ohne async oder defer) blockiert das Skript die HTML-Verarbeitung und wird sofort ausgeführt, sobald es aufgerufen wird.
Das Attribut defer="defer" zeigt an, dass das Skript ausgeführt wird, nachdem das HTML-Dokument vollständig geparst wurde.
Das Attribut async="async" zeigt an, dass das Skript asynchron ausgeführt wird, sobald es heruntergeladen wurde, ohne die Verarbeitung zu blockieren.

Zur Auswahl eines HTML-Elements verwendet JavaScript die Methode document.getElementById().

Beispiel für das HTML `<script>`-Tag:

HTML <script>-Tag

html

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <p id="example"></p>
    <script>
      document.getElementById("example").innerHTML = "My first JavaScript code";
    </script>
  </body>
</html>

Try it Yourself »

Unterschiede zwischen HTML 4.01 und HTML5

HTML 4 erfordert das type-Attribut, während es in HTML5 optional ist. In HTML5 ist das async-Attribut neu. HTML5 unterstützt das HTML 4.01 xml:space-Attribut nicht.

Unterschiede zwischen HTML und XHTML

In XHTML wird der Inhalt innerhalb von Skripten als #PCDATA (anstatt CDATA) deklariert. In solchen Fällen werden die Entitäten geparst.

In XHTML müssen alle Sonderzeichen kodiert werden, oder der gesamte Inhalt muss in einen CDATA-Abschnitt eingebettet werden.

Beispiel für das HTML <script>-Tag

html

<script type="text/javascript">
//<![CDATA[
var i = 10;
if (i < 5) {
  // some code
}
//]]>
</script>

Attribute

Attribute	Value	Description
async	async	Legt fest, dass das Skript asynchron ausgeführt wird.
charset	charset	Legt die Zeichenkodierung fest, die in einer externen Datei mit dem JavaScript-Code verwendet wird. In HTML5 veraltet.
defer	defer	Legt fest, dass das Skript nach dem Laden der Seite ausgeführt werden muss.
src	URL	Legt die URL einer externen Datei mit dem JavaScript-Code fest. (Kann entweder relativ oder absolut sein).
type	media_type	Legt den MIME-Typ des Skripts fest.

Das <script>-Tag unterstützt die Globalen Attribute und die Ereignisattribute.

Praxis

Welche Funktion hat das HTML <script>-Tag?

Es wird zum Einbetten von Skripten in HTML oder zum Verweisen auf externe Skriptdateien verwendet.Es wird zum Einbetten von CSS-Stilen in HTML verwendet.Es wird speziell zum Einbetten von JavaScript-Skripten verwendet.Es wird zum Erstellen von HTML-Tabellen verwendet.Die Skripte können ausgeführt werden, wenn ein Ereignis eintritt, z. B. wenn ein Benutzer auf ein HTML-Element klickt oder wenn das Laden einer Seite abgeschlossen ist.

HTML <script>-Tag ​

Syntax ​

Wichtige Hinweise ​

Beispiel für das HTML <script>-Tag: ​

Unterschiede zwischen HTML 4.01 und HTML5 ​

Unterschiede zwischen HTML und XHTML ​

Attribute ​

Praxis ​