Ihr erstes JavaScript-Lab - Programmieren lernen

Einführung

🧑‍💻 Neu bei Linux oder LabEx? Wir empfehlen, mit dem Kurs Quick Start with Linux zu beginnen.

Hallo und herzlich willkommen bei LabEx! In diesem ersten Lab lernen Sie das klassische "Hello, World!"-Programm in JavaScript kennen.

Klicken Sie auf die Schaltfläche Weiter unten, um das Lab zu starten.

Skills Graph

Hallo JavaScript

JavaScript ist eine Programmiersprache, mit der Sie Websites interaktiv gestalten können. Sie wird verwendet, um dynamische, interaktive Webseiten zu erstellen. Es handelt sich um eine interpretierte Programmiersprache mit objektorientierten Fähigkeiten.

Wir werden JavaScript verwenden, um eine einfache Webseite zu erstellen, die eine Nachricht anzeigt, wenn auf eine Schaltfläche geklickt wird.

index.html wurde in der WebIDE erstellt. Öffnen Sie es und fügen Sie den folgenden Code hinzu:

<!doctype html>
<html>
  <head>
    <title>Hello, World!</title>
  </head>
  <body>
    <h1 id="message">Click the button to display the message!</h1>

    <button onclick="displayMessage()">Click me</button>

    <script>
      function displayMessage() {
        document.getElementById("message").textContent = "Hello, JavaScript!";
      }
    </script>
  </body>
</html>

Der obige Code zeigt eine Nachricht an, wenn auf die Schaltfläche geklickt wird. Die Nachricht wird im h1-Element mit der ID message angezeigt.

Das onclick-Attribut wird verwendet, um die displayMessage()-Funktion aufzurufen, wenn auf die Schaltfläche geklickt wird. Die displayMessage()-Funktion ändert den Textinhalt des h1-Elements in "Hello, JavaScript!".

Klicken Sie dann auf die Schaltfläche Go Live in der unteren rechten Ecke. Dadurch wird ein lokaler Webserver auf Port 8080 gestartet.

Nun können Sie auf die Registerkarte Web 8080 wechseln und auf die Aktualisierungsschaltfläche klicken, um die Änderungen zu sehen.

Webseite mit der Anzeige "Hello JavaScript"

Zusammenfassung

Herzlichen Glückwunsch! Sie haben Ihr erstes LabEx-Lab abgeschlossen.

Wenn Sie mehr über LabEx und seine Verwendung erfahren möchten, können Sie unseren Support Center besuchen. Oder Sie können sich das Video ansehen, um mehr über LabEx zu erfahren.

Programmieren ist eine lange Reise, aber das nächste Lab ist nur einen Klick entfernt. Lassen Sie uns anfangen!