This article seeks to document the difference between CSS Selectors and XPath for web developers to be able to better choose the right tool for the right job.
| XPath feature | CSS equivalent |
|---|---|
ancestor, parent or preceding-sibling axis |
:has() selector Experimental |
attribute axis |
Attribute selectors |
child axis |
Child combinator |
descendant axis |
Descendant combinator |
following-sibling axis |
General sibling combinator or adjacent sibling combinator |
self axis |
:scope or :host selector |