Carrera Creador IA · Nivel 2 de 5 · 9-16 añosPRO

Hazla viva (JavaScript)

Tu web reacciona: un botón que hace algo con JS.

Tu Carrera · 0 de 5 nivelesse hacen en orden

1 2 3 4 5

Paso 1 de 6

¿Qué es JavaScript?

HTML es el contenido; CSS cómo se ve; JavaScript hace que la página REACCIONE. Aquí harás un botón que cuenta.

👉 Mira el código: hay un `<script>` con JavaScript. Cuando lo entiendas, dale Siguiente.

tu código · index.html

<!doctype html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <title></title>
  <style>
    body{font-family:system-ui,sans-serif;background:#0b1020;color:#e8e8f0;min-height:100vh;margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:14px;padding:24px}
    h1{color:#8b5cf6;margin:0}
    #pantalla{font-size:64px;font-weight:800}
    button{font-size:20px;font-weight:800;padding:14px 26px;border:0;border-radius:999px;background:#4dffd6;color:#07080f;cursor:pointer}
  </style>
</head>
<body>
  <h1></h1>
  <p id="pantalla"></p>
  <button onclick="sube()"></button>
  <script>
    let contador = 0;
    function sube(){
      
      document.getElementById('pantalla').textContent = contador;
    }
  </script>
</body>
</html>

tu web en vivo · 10 etiquetas

← Nivel 1 Nivel 3: Programar de verdad →