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

The doc http://code.google.com/chrome/devtools/docs/elements.html says it supports XPath or CSS selectors, but when I tried, didn't seem to work for me.

Any one k开发者_如何学Pythonnows how to use it?

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')

If you click on any element in the elements pane then type command-F, it will open a search bar that lets you search for elements using xpath selectors.