Curso Práctico de JavaScript

Toma las primeras clases gratis

COMPARTE ESTE ARTÍCULO Y MUESTRA LO QUE APRENDISTE

  1. Dentro de cualquier carpeta dentro de tu computadora, crea un nuevo archivo llamado main.js y guárdalo.
  2. Crea un archivo html llamado index.html en el mismo lugar donde creaste tu archivo main.js
  3. Dentro del archivo index.html crea una estructura básica con la línea html:5
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
</body>
</html>

4.Ingresa las siguientes dos líneas de código dentro de tu archivo html

  <h1>Platzi is cool</h1>
  <script src="./main.js"></script>

Y este quedaría de la siguiente manera:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!-- <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> -->
    <title>Document</title>
</head>
<body>
    <h1>Platzi is cool</h1>
    <script src="./main.js"></script>
</body>
</html>
  1. Ahora añade el siguiente código al archivo main.js
const miTitulo = document.querySelector('h1');
miTitulo.textContent = '¡Hola Mundo!';
  1. Recuerda que Document.querySelector() retorna el primer elemento dentro del documento que coincide con el selector especificado, o grupo de selectores.

  2. Guarda los archivos HTML y JavaScript, y abre index.html en el navegador de tu preferencia.

  3. Gracias por visitar mi tutorial!

Curso Práctico de JavaScript

Toma las primeras clases gratis

COMPARTE ESTE ARTÍCULO Y MUESTRA LO QUE APRENDISTE

0 Comentarios

para escribir tu comentario

Artículos relacionados