Cómo depurar HTML y JavaScript

Encuentra errores de selectores, estilos y ejecución con un ejemplo pequeño y la consola.

HTML CSS JS Compiler · Metodología · Contacto

Pasos

Empieza con la plantilla inicial o carga un proyecto de ejemplo.
Edita la estructura HTML, los estilos CSS y el comportamiento JavaScript.
Pulsa Ejecutar (Ctrl/Cmd + Enter) para actualizar la vista previa en sandbox.
Abre el panel de consola para leer logs, advertencias y errores.
Usa los controles responsivos para comprobar el diseño en anchos habituales.
Formatea, copia o descarga tu trabajo como index.html.

Ejemplo

HTML

<button id="demo">Hello</button>

CSS

#demo { padding: 12px; }

JavaScript

// Broken: document.getElementById("missing").textContent = "OK";
const button = document.getElementById("demo");
if (button) button.textContent = "OK";

El ID missing no existe y provoca un error. Usa demo para encontrar el botón; un validador de sintaxis no detecta este fallo de ejecución.

Consejo

La ejecución básica de HTML, CSS y JavaScript para la vista previa ocurre localmente en tu navegador.