JavaScript Ausgabe

JavaScript hat keine Druck- oder Ausgabefunktionen.

JavaScript-Datenanzeige

JavaScript kann Daten auf verschiedene Arten ausgeben:

  • Mitwindow.alert()wird ein Warnungsdialogfeld angezeigt.
  • Mitdocument.write()schreibt die Methode Inhalte in ein HTML-Dokument.
  • MitinnerHTMLin ein HTML-Element schreiben.
  • Mitconsole.log()in die Browser-Konsole schreiben.

Mit window.alert()

Sie können ein Alert-Feld einblenden, um Daten anzuzeigen:

Beispiel

<!DOCTYPE html>
<html>
<body>

<h1>Meine erste Seite</h1>
<p>Mein erster Absatz.</p>

<script>
window.alert(5 + 6);
</script>

</body>
</html>

Selbst ausprobieren »

HTML-Elemente manipulieren

Um von JavaScript aus auf ein HTML-Element zuzugreifen, können Sie die Methode document.getElementById(id) verwenden.

Verwenden Sie das "id"-Attribut, um das HTML-Element zu identifizieren, und innerHTML, um den Elementinhalt abzurufen oder einzufügen:

Beispiel

<!DOCTYPE html>
<html>
<body>

<h1>Meine erste Webseite</h1>

<p id="demo">Mein erster Absatz</p>

<script>
document.getElementById("demo").innerHTML = "Paragraph modified.";
</script>

</body>
</html>

Selbst ausprobieren »

Die obige JavaScript-Anweisung (innerhalb des <script>-Tags) kann in einem Webbrowser ausgeführt werden:

document.getElementById("demo")ist JavaScript-Code, der das id-Attribut verwendet, um ein HTML-Element zu finden.

innerHTML = "Paragraph modified."ist JavaScript-Code, der verwendet wird, um den HTML-Inhalt des Elements (innerHTML) zu ändern.

In diesem Tutorial

In den meisten Fällen verwenden wir in diesem Tutorial die oben beschriebene Methode zur Ausgabe:

Das obige Beispiel schreibt das <p>-Element mit id="demo" direkt in die Ausgabe des HTML-Dokuments:

In ein HTML-Dokument schreiben

Zu Testzwecken können Sie JavaScript direkt in ein HTML-Dokument schreiben:

Beispiel

<!DOCTYPE html>
<html>
<body>

<h1>Meine erste Webseite</h1>

<p>Mein erster Absatz.</p>

<script>
document.write(Date());
</script>

</body>
</html>

Selbst ausprobieren »

Note

Mit document.write() können Sie Inhalt in das Dokument schreiben.

Wenn document.write ausgeführt wird, nachdem das Dokument fertig geladen ist, wird die gesamte HTML-Seite überschrieben.

Beispiel

<!DOCTYPE html>
<html>
<body>

<h1>Meine erste Webseite</h1>

<p>Mein erster Absatz.</p>

<button onclick="myFunction()">Klick mich</button>

<script>
function myFunction() {
    document.write(Date());
}
</script>

</body>
</html>

Selbst ausprobieren »

In die Konsole schreiben

Wenn Ihr Browser das Debugging unterstützt, können Sie dieconsole.log()-Methode verwenden, um JavaScript-Werte im Browser anzuzeigen.

Verwenden Sie im Browser F12, um den Debugging-Modus zu aktivieren, und klicken Sie im Debug-Fenster auf das Menü "Console".

Beispiel

<!DOCTYPE html>
<html>
<body>

<h1>Meine erste Webseite</h1>

<script>
a = 5;
b = 6;
c = a + b;
console.log(c);
</script>

</body>
</html>

Selbst ausprobieren »

Beispiel für einen Konsolen-Screenshot:

Wussten Sie schon?

Note Debugging in der Programmierung ist der Prozess des Testens, Findens und Reduzierens von Bugs (Fehlern).
Weitere Erweiterungen