[html] How can I find an element by CSS class with XPath?

In my webpage, there's a div with a class named Test.

How can I find it with XPath?

Most easy way..

//div[@class="Test"]

Assuming you want to find <div class="Test"> as described.

XPath has a contains-token function, specifically designed for this situation:

//div[contains-token(@class, 'Test')]

It's only supported in the latest version of XPath (3.1) so you'll need an up-to-date implementation.

The ONLY right way to do it with XPath :

//div[contains(concat(" ", normalize-space(@class), " "), " Test ")]

The function normalize-space strips leading and trailing whitespace, and also replaces sequences of whitespace characters by a single space.

Note

If not need many of these Xpath queries, you might want to use a library that converts CSS selectors to XPath, as CSS selectors are usually a lot easier to both read and write than XPath queries. For example, in this case, you could use both div[class~="Test"] and div.Test to get the same result.

Some libraries I've been able to find :

• For JavaScript : css2xpath & css-to-xpath
• For PHP : CssSelector Component
• For Python : cssselect
• For C# : css2xpath Reloaded
• For GO : css2xpath

Match against one class that has whitespace.

<div class="hello "></div>

//div[normalize-space(@class)="hello"]

I'm just providing this as an answer, as Tomalak provided as a comment to meder's answer a long time ago

//div[contains(concat(' ', @class, ' '), ' Test ')]