Limpiador HTML: elimina atributos, scripts y ruido online
Pega HTML desordenado y obtén una estructura limpia sin atributos junto con un esquema JSON de la estructura; elimina scripts, estilos, comentarios, SVG, formularios y selectores personalizados.
Funciona íntegramente en tu navegador con el analizador HTML nativo; no se sube nada. Es útil para extraer contenido, crear flujos de scraping, migrar un CMS y preparar HTML para un LLM.
Limpiador HTML: elimina atributos, scripts y ruido online
Pega HTML desordenado y obtén una estructura limpia sin atributos junto con un esquema JSON de la estructura; elimina scripts, estilos, comentarios, SVG, formularios y selectores personalizados.
Acerca del limpiador HTML
El HTML copiado de sitios web reales arrastra una enorme cantidad de lastre: clases de frameworks, estilos en línea, atributos data-*, scripts de seguimiento, iconos SVG, marcadores de comentarios y capas de div contenedores con una sola función. Cuando solo necesitas la estructura del contenido —para un flujo de scraping, una migración de CMS, una comparación o para recortar una página antes de enviarla a un modelo de lenguaje— todo lo demás es ruido que oculta lo importante y consume tokens.
Esta herramienta analiza tu HTML con el propio analizador del navegador (DOMParser) y aplica una limpieza configurable: elimina todos los atributos (conservando opcionalmente href en los enlaces para mantener el grafo de enlaces), descarta nodos script, style, comentarios, SVG y formularios, elimina elementos que coincidan con tus selectores CSS personalizados (uno por línea, práctico para navegación o banners de cookies), depura etiquetas vacías y, opcionalmente, quita cada contenedor que tenga exactamente un hijo y ningún texto propio, reduciendo los anidados div.
Se generan dos salidas lado a lado: el HTML limpio y un esquema JSON de la estructura restante (tag, text, children, href), cómodo para procesarlo con código. El indicador de tamaño muestra cuánto se ha reducido el resultado; en páginas modernas habituales, la estructura limpia suele ser un 80-95% menor que la entrada. Todo se ejecuta localmente en la pestaña del navegador: el HTML nunca sale de tu dispositivo.
Ejemplos de limpieza HTML
Qué hace cada opción con un fragmento.
| Entrada | Salida | Notas |
|---|---|---|
| ⟨div class="a b c" data-x="1"⟩⟨p style="color:red"⟩Hi⟨/p⟩⟨/div⟩ | ⟨div⟩⟨p⟩Hi⟨/p⟩⟨/div⟩ | Se eliminan todos los atributos; se conservan la estructura y el texto. |
| ⟨p⟩Text⟨script⟩evil()⟨/script⟩⟨/p⟩ | ⟨p⟩Text⟨/p⟩ | Las etiquetas script se eliminan por completo. |
| ⟨a class="btn" href="/docs"⟩Docs⟨/a⟩ | ⟨a href="/docs"⟩Docs⟨/a⟩ | Con «Conservar href» activado, los enlaces siguen funcionando. |
| ⟨div⟩⟨div⟩⟨p⟩Deep⟨/p⟩⟨/div⟩⟨/div⟩ | ⟨p⟩Deep⟨/p⟩ | «Elevar contenedores con un solo hijo» reduce los anidados puros. |
Cómo usar el limpiador HTML
- Pega el HTML en el cuadro de entrada.
- Marca las opciones de limpieza que quieras; añade selectores CSS específicos del sitio, uno por línea, para elementos como barras de navegación o bloques de anuncios.
- Haz clic en «Limpiar HTML».
- Copia el HTML limpio o la estructura JSON si la vas a procesar con código.
- El indicador de tamaño te dice cuánto ruido se ha eliminado.
Preguntas frecuentes sobre el limpiador HTML
¿Se sube mi HTML a un servidor?
No. El análisis y la limpieza se ejecutan íntegramente en tu navegador mediante DOMParser. La página funciona sin conexión una vez cargada.
¿Qué hacen los selectores personalizados?
Cualquier elemento que coincida con uno de tus selectores CSS (uno por línea) se elimina antes de la limpieza; por ejemplo, «nav», «#sidebar» o «div[class*=ads]». Los selectores no válidos se omiten.
¿Para qué sirve la salida JSON?
Es un esquema de la estructura limpia: objetos con tag, text, children y, opcionalmente, href. Resulta práctico para scrapers, pruebas o para pasar contenido estructurado a un programa sin volver a analizar el HTML.
¿Qué significa «elevar contenedores con un solo hijo»?
Si un elemento contiene exactamente un elemento hijo y no tiene texto propio, se elimina el contenedor y el hijo ocupa su lugar. Al aplicarse de forma recursiva, reduce los profundos anidados de div habituales en sitios modernos.
¿Por qué limpiar el HTML antes de enviarlo a un LLM?
Los nombres de clase, estilos en línea y scripts consumen tokens sin aportar significado. La estructura limpia suele ser un 80-95% menor, reduce el coste y deja al modelo más espacio para el contenido.
¿Se conservan las imágenes y los saltos de línea?
El proceso de «eliminar etiquetas vacías» conserva explícitamente los elementos br e img aunque no tengan hijos, porque tienen significado por sí mismos.