How to search DOM elements using XPath or CSS selectors in Chrome Developer Tools?

How do I find the XPath in Chrome Developer Tools?

We can open the Developer tool in Chrome by pressing F12, then the Console tab is to be selected. We can validate the xpath with the $x("<xpath value>") expression. On clicking Enter after entering the expression, an array of matching elements will be displayed.

You can use $x in the Chrome javascript console. No extensions needed.

ex: $x("//img")

Just typing xpath expression in the search box should work. It works for me in tip-of-tree build.

The feature seems to be broken in Chrome 11 though, I've filed a bug on this: http://crbug.com/79716

For xpath searches use $x('xpathSelector'). For a css selector use $('cssSelector').

However, this last selector returns only the first matching element. If you want to see all matching elements go for $$('cssSelector')