Comparison of CSS Selectors and XPath

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 Subsequent-sibling combinator or Next-sibling combinator
self axis :scope or :host selector