Your First JavaScript Lab

Introduction

🧑‍💻 New to Linux or LabEx? We recommend starting with the Quick Start with Linux course.

Hi there, welcome to LabEx! In this first lab, you'll learn the classic "Hello, World!" program in JavaScript.

Click the Continue button below to start the lab.

Hello JavaScript

JavaScript is a programming language that allows you to add interactivity to websites. It is used to create dynamic, interactive web pages. It is an interpreted programming language with object-oriented capabilities.

We will be using JavaScript to create a simple web page that will display a message when a button is clicked.

index.html has been created in WebIDE. Open it and add the following code:

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

The code above will display a message when the button is clicked. The message is displayed in the h1 element with the id message.

The onclick attribute is used to call the displayMessage() function when the button is clicked. The displayMessage() function will change the text content of the h1 element to "Hello, JavaScript!".

Then click on the bottom right corner Go Live button, this will run a local web server on 8080 port.

Now, you can switch to the Web 8080 Tab, and click the refresh button to see the changes.

Summary

Coungratulations! You have completed your first LabEx Lab.

If you want to learn more about LabEx and how to use it, you can visit our Support Center . Or you can watch the video to learn more about LabEx.

Programming is a long journey, but Next Lab is just one click away. Let's do it!

Introduction

Hello JavaScript

Summary

Other Tutorials you may like