CSS selector
A CSS selector is a pattern that points at specific elements in an HTML document by tag, class, id, or position, originally for styling but widely used to locate values when scraping a page.
A CSS selector is a small pattern that matches elements in an HTML document. Selectors like .price, #main h1, or div.card > span identify nodes by tag name, class, id, attribute, or relationship to other nodes. They were designed for applying styles, but scrapers reuse them to pinpoint the exact element that holds a value they want to extract.
The trouble is that selectors describe where data sits in the markup, not what it means. When a site changes its class names, reorders its DOM, or ships a redesign, every selector that pointed at the old structure silently breaks. This is the ongoing maintenance cost that makes selector-based scrapers fragile and expensive to run at scale.
Extracto takes a different approach: no CSS selectors and no XPath. You describe the data you want with a JSON Schema, the page is rendered in a headless browser, and an LLM maps the content onto your schema by meaning rather than position. When the layout changes, your schema still describes the same fields, so there is nothing to rewrite.
Examples
A typical price selector
A scraper might target span.product-price to grab a price. If the site renames that class to span.price-now in a redesign, the selector matches nothing and the scraper quietly returns empty results.
Brittle positional selectors
A selector like div:nth-child(3) > p depends on exact element order. Inserting a single new element above it shifts everything, so the selector now reads the wrong value without any error.
See also
CSS selector: FAQ
Why do CSS selectors break so often in scraping?
Does Extracto use CSS selectors under the hood?
Want to put this into practice? Extracto extracts structured data from a URL using a JSON schema, with the result validated before it leaves the API. Try the live demo or read the docs.