最初の JavaScript 実験 - コーディングを学ぶ

はじめに

🧑‍💻 Linux や LabEx が初めてですか？Linux のクイックスタートコースから始めることをおすすめします。

こんにちは、LabEx へようこそ！この最初の実験（Lab）では、JavaScript の古典的な「Hello, World!」プログラムを学びます。

下の続けるボタンをクリックして、実験を開始してください。

これは Guided Lab です。学習と実践を支援するためのステップバイステップの指示を提供します。各ステップを完了し、実践的な経験を積むために、指示に注意深く従ってください。過去のデータによると、この中級レベルの実験の完了率は 72%です。学習者から 99% の好評価を得ています。

こんにちは、JavaScript

JavaScript は、ウェブサイトにインタラクティブ性を追加することができるプログラミング言語です。動的でインタラクティブなウェブページを作成するために使用されます。オブジェクト指向の機能を持つインタプリタ型のプログラミング言語です。

ここでは、ボタンをクリックしたときにメッセージを表示する簡単なウェブページを JavaScript を使って作成します。

WebIDE で index.html が作成されています。これを開き、以下のコードを追加してください。

<!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>

上記のコードは、ボタンがクリックされたときにメッセージを表示します。メッセージは、id が message の h1 要素に表示されます。

onclick 属性は、ボタンがクリックされたときに displayMessage() 関数を呼び出すために使用されます。displayMessage() 関数は、h1 要素のテキストコンテンツを「Hello, JavaScript!」に変更します。

次に、右下隅のGo Liveボタンをクリックします。これにより、ポート 8080 でローカルウェブサーバーが起動します。

これで、Web 8080タブに切り替え、更新ボタンをクリックすると、変更を確認できます。

まとめ

おめでとうございます！最初の LabEx 実験（Lab）を完了しました。

LabEx についてもっと詳しく知り、その使い方を学びたい場合は、サポートセンターをご覧ください。また、ビデオを見て、LabEx についてもっと学ぶこともできます。

プログラミングは長い旅ですが、次の実験（Lab） はクリック一つです。始めましょう！