≡En resumen
- XPath describe rutas para llegar a elementos, atributos o texto de un documento XML o HTML.
- Los predicados entre corchetes filtran nodos: //a[@rel='nofollow'] selecciona los enlaces nofollow.
- Para combinar condiciones se usa and u or dentro del predicado: //input[@type='email' and @required].
- Los navegadores solo implementan XPath 1.0, así que funciones de versiones posteriores no funcionan en Selenium ni en la consola.
- En SEO, XPath permite extraer títulos, precios o etiquetas en Google Sheets (IMPORTXML) y en rastreadores como Screaming Frog.
01 ¿Qué es XPath?
El W3C publicó XPath 1.0 como recomendación el 16 de noviembre de 1999. La propia especificación explica el nombre: XPath usa una notación de rutas parecida a la de las URL para moverse por la jerarquía de un documento. Nació para servir de base común a XSLT (transformaciones de XML) y XPointer, y más tarde a XQuery.
Aunque se diseñó para XML, hoy su uso más frecuente es el HTML: los navegadores convierten cada página en un árbol de nodos (el DOM) y XPath permite señalar cualquier parte de ese árbol con una sola línea.
| Versión | Recomendación W3C | Novedades principales |
|---|---|---|
| XPath 1.0 | 16/11/1999 | Rutas, ejes, predicados y una biblioteca de 27 funciones. Es la que implementan los navegadores. |
| XPath 2.0 | 23/01/2007 | Secuencias, tipos de datos de XML Schema, expresiones if y for, expresiones regulares |
| XPath 3.0 | 08/04/2014 | Funciones de orden superior y operador de concatenación || |
| XPath 3.1 | 21/03/2017 | Mapas y arrays, con soporte para JSON |
02 Sintaxis básica de XPath
Una expresión XPath se lee de izquierda a derecha, como una ruta de carpetas. Estas son las piezas que usarás en el 90 % de los casos:
| Sintaxis | Significado | Ejemplo |
|---|---|---|
| / | Hijo directo (o raíz si va al principio) | /html/body |
| // | Descendiente en cualquier nivel | //p |
| @ | Atributo | //img/@alt |
| [ ] | Predicado o filtro | //li[1] |
| * | Cualquier elemento | //div/* |
| . y .. | Nodo actual y nodo padre | //span/.. |
| text() | Nodo de texto | //h1/text() |
| | | Unión de dos conjuntos de nodos | //h1 | //h2 |
03 Operadores and y or en XPath (con ejemplos)
Para exigir varias condiciones a la vez se usa el operador and dentro del predicado; para aceptar una u otra, or. Se escriben siempre en minúsculas: AND, && o || no funcionan como operadores lógicos en XPath 1.0.
| Expresión | Qué selecciona |
|---|---|
| //input[@type='email' and @required] | Campos de email que además son obligatorios |
| //a[contains(@href,'/blog/') and @target='_blank'] | Enlaces al blog que se abren en otra pestaña |
| //a[@rel='nofollow' or @rel='sponsored'] | Enlaces marcados como nofollow o sponsored |
| //img[not(@alt) or @alt=''] | Imágenes sin texto alternativo o con alt vacío |
| //producto[precio > 20 and stock > 0] | Productos de más de 20 con existencias (en XML) |
| //button[@type='submit' and (contains(., 'Enviar') or contains(., 'Send'))] | Botones de envío en español o en inglés |
//li[@class='item' and @data-stock='1'] y //li[@class='item'][@data-stock='1'] devuelven lo mismo. La diferencia aparece con la posición: //li[@class='item'][2] es el segundo de los elementos con esa clase, mientras que //li[2][@class='item'] es el segundo li de su lista, solo si además tiene esa clase.
04 Funciones XPath más útiles: contains(), text() y compañía
contains(a, b)
Devuelve verdadero si el texto a contiene b. //div[contains(@class,'precio')] encuentra clases como «precio precio-oferta».
starts-with(a, b)
Comprueba el inicio de un texto: //a[starts-with(@href,'https')] selecciona enlaces seguros.
normalize-space()
Quita espacios sobrantes: //button[normalize-space()='Comprar'] evita fallos por saltos de línea.
not()
Niega una condición: //a[not(@rel)] devuelve enlaces sin atributo rel.
count()
Cuenta nodos: count(//h1) debería dar 1 en la mayoría de páginas.
last() y position()
Filtran por posición: //tr[last()] es la última fila de cada tabla.
05 Cómo probar una expresión XPath en Chrome
-
1
Abre las DevTools
Pulsa F12 o clic derecho y «Inspeccionar» sobre la página que quieres analizar.
-
2
Busca en el panel Elements
Pulsa Ctrl+F (Cmd+F en Mac) dentro del panel: el buscador acepta expresiones XPath y resalta las coincidencias.
-
3
Usa la consola
Escribe $x("//h2") en la pestaña Console: devuelve un array con los elementos que coinciden.
-
4
Copia un XPath generado
Clic derecho sobre un nodo y «Copy > Copy XPath». Úsalo como punto de partida, no como expresión final.
-
5
Hazlo robusto
Sustituye rutas absolutas como /html/body/div[3]/div[2] por atributos estables: //form[@id='contacto']//input[@name='email'].
En JavaScript puedes hacer lo mismo con document.evaluate(), un método disponible en todos los navegadores modernos que funciona tanto con documentos HTML como XML.
06 Para qué se usa XPath: Selenium, scraping y SEO
Pruebas automáticas
Selenium, Playwright y otras herramientas localizan botones y campos con XPath para simular a un usuario.
Web scraping
Librerías como lxml o Scrapy extraen precios, fichas o reseñas de páginas web con expresiones XPath.
Transformar XML
XSLT usa XPath para convertir un XML en HTML, otro XML o texto, por ejemplo en feeds de productos.
Auditorías SEO
Los rastreadores SEO permiten extracción personalizada con XPath para revisar etiquetas en miles de URL.
La función IMPORTXML(url; consulta_xpath) de Google Sheets importa datos de una página con una expresión XPath. Algunas consultas útiles para SEO:
=IMPORTXML(A2; "//title"): el título de la URL de la celda A2.=IMPORTXML(A2; "//meta[@name='description']/@content"): la meta descripción.=IMPORTXML(A2; "//link[@rel='canonical']/@href"): la URL canónica.=IMPORTXML(A2; "//a[@rel='nofollow' and contains(@href,'http')]/@href"): enlaces externos nofollow.
Es una forma rápida de preparar una auditoría web SEO sin instalar nada, aunque para webs grandes compensa un rastreador.
Si extraes datos con frecuencia, lo sensato es automatizarlo: un flujo que visite las URL, aplique las expresiones y guarde el resultado en una hoja o base de datos. Puedes montarlo con herramientas como las que explicamos en automatizaciones n8n o encargarlo como desarrollo web a medida cuando necesitas volumen, control de errores y respeto por las condiciones de cada sitio.
07 XPath vs selectores CSS: cuál usar
| Criterio | XPath | Selector CSS |
|---|---|---|
| Documentos | XML y HTML | HTML (y XML en algunos entornos) |
| Buscar por texto visible | Sí: //a[contains(., 'Contacto')] | No de forma estándar |
| Subir al elemento padre | Sí, con .. o ancestor:: | Solo con :has(), de soporte más reciente |
| Operadores lógicos | and, or y not() | Coma para «o» y :not() |
| Legibilidad | Más larga | Más corta: div.precio > span |
| Uso típico | Scraping complejo, XSLT, IMPORTXML | Estilos, JavaScript y pruebas sencillas |
Preguntas frecuentes sobre XPath
Es un lenguaje del W3C para localizar nodos de un documento XML o HTML mediante rutas. Por ejemplo, //h1 selecciona todos los encabezados H1 de una página.
Dentro de un predicado y en minúsculas: //input[@type='email' and @required] selecciona los campos de email obligatorios. Puedes encadenar varias condiciones con and y agruparlas con paréntesis.
and exige que se cumplan todas las condiciones y or que se cumpla al menos una. or tiene menos precedencia que and, por eso conviene usar paréntesis al combinarlos.
Una barra selecciona hijos directos; dos barras seleccionan descendientes en cualquier nivel. /html/body/p solo encuentra párrafos hijos de body; //p los encuentra en toda la página.
Con contains() o comparando el texto: //button[contains(., 'Comprar')] o //a[normalize-space()='Contacto']. El punto representa el texto completo del elemento.
CSS es más corto y legible para casos simples. XPath es mejor cuando necesitas filtrar por texto, combinar condiciones o subir al elemento padre.
XPath 1.0. Por eso funciones de versiones posteriores, como matches() o lower-case(), no funcionan en la consola de Chrome ni en Selenium.
Fuentes consultadas
Sobre el autor
Germán Gutiérrez
Development Manager en appyweb
Dirige el equipo de desarrollo de appyweb: aplicaciones web y móviles, SaaS, integraciones y arquitectura de software.
Ver perfil en LinkedIn ↗