AZ Tools

Probador de selectores CSS

Desarrollo

Pega HTML y un selector CSS para ver al instante todos los elementos que el selector encuentra, con el recuento y el marcado de cada elemento coincidente. Usa el propio motor de selectores del navegador, así que los resultados son idénticos a document.querySelectorAll: ideal para depurar scrapers, hojas de estilo y selectores de prueba. Los selectores no válidos se señalan. Todo se ejecuta localmente en tu navegador: no se sube nada.

Cómo usar

  1. Pega tu HTML en el primer cuadro.
  2. Escribe un selector CSS (por ejemplo li.item o a[href^="https"]).
  3. Mira el recuento de coincidencias y cada elemento coincidente; cópialos si hace falta.

Preguntas frecuentes

¿Qué selectores se admiten?
Cualquier selector que tu navegador soporte vía querySelectorAll, incluidos combinadores, selectores de atributo, :not(), :nth-child() y más. Los pseudoelementos como ::before no coinciden con nada, igual que en el DOM.
¿Son precisos los resultados?
Sí. El HTML se analiza en un documento real y se consulta con el motor de selectores nativo del navegador, así que las coincidencias son exactamente lo que querySelectorAll devolvería en ese marcado.
¿Y si mi selector no es válido?
El campo del selector se resalta y se muestra un mensaje de error, en lugar de devolver resultados engañosos.
¿Se envía mi HTML a algún sitio?
No. El análisis y la coincidencia ocurren por completo en tu navegador; no se sube nada.

Herramientas relacionadas