Tu primer laboratorio de JavaScript

Beginner

💡 Este tutorial está traducido por IA desde la versión en inglés. Para ver la versión original, puedes hacer clic aquí

Introducción

Hola, bienvenido a LabEx. En este primer laboratorio, aprenderás el clásico programa "Hello, World!" en JavaScript.

Haz clic en el botón Continuar de abajo para comenzar el laboratorio.


Skills Graph

Hola JavaScript

JavaScript es un lenguaje de programación que te permite agregar interactividad a los sitios web. Se utiliza para crear páginas web dinámicas e interactivas. Es un lenguaje de programación interpretado con capacidades orientadas a objetos.

Utilizaremos JavaScript para crear una página web sencilla que mostrará un mensaje cuando se haga clic en un botón.

index.html se ha creado en WebIDE. Ábrelo y agrega el siguiente código:

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

El código anterior mostrará un mensaje cuando se haga clic en el botón. El mensaje se muestra en el elemento h1 con el id message.

El atributo onclick se utiliza para llamar a la función displayMessage() cuando se hace clic en el botón. La función displayMessage() cambiará el contenido de texto del elemento h1 a "Hello, JavaScript!".

Código HTML para un botón interactivo

Luego, haz clic en el botón Go Live en la esquina inferior derecha. Esto ejecutará un servidor web local en el puerto 8080.

Ahora, puedes cambiar a la pestaña Web 8080 y hacer clic en el botón de actualización para ver los cambios.

Página web que muestra Hola JavaScript

Resumen

¡Felicidades! Has completado tu primer laboratorio en LabEx.

Si quieres aprender más sobre LabEx y cómo usarlo, puedes visitar nuestro Centro de Soporte. O puedes ver el vídeo para conocer más sobre LabEx.

La programación es un largo camino, pero el Siguiente Laboratorio está a solo un clic de distancia. ¡Empecemos!