Jak znaleźć element według klasy CSS za pomocą XPath?

Na mojej stronie znajduje divsię classnazwa Test.

Jak mogę to znaleźć XPath?

Ten selektor powinien działać, ale będzie bardziej wydajny, jeśli zastąpisz go odpowiednim znacznikiem:

//*[contains(@class, 'Test')]

Lub, ponieważ wiemy, że poszukiwany element to div:

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

Ale ponieważ będzie to również pasować do przypadków takich jak class="Testvalue"lub class="newTest", wersja @ Tomalak podana w komentarzach jest lepsza :

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

Jeśli chcesz być naprawdę pewien, że będzie pasował poprawnie, możesz również użyć funkcji normalizacji spacji, aby usunąć zbłąkane białe znaki wokół nazwy klasy (jak wspomniano w @Terry):

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

Zauważ, że we wszystkich tych wersjach * należy najlepiej zastąpić dowolną nazwą elementu, który chcesz dopasować, chyba że chcesz wyszukać każdy element w dokumencie pod kątem danego warunku.

Najłatwiejszy sposób ..

//div[@class="Test"]

Zakładając, że chcesz znaleźć <div class="Test">zgodnie z opisem.

Tylko właściwy sposób to zrobić z XPath:

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

Funkcja normalize-spaceusuwa wiodące i końcowe białe znaki, a także zastępuje ciąg znaków białych znaków pojedynczą spacją.

Uwaga

Jeśli nie potrzebujesz wielu z tych zapytań Xpath, możesz użyć biblioteki, która konwertuje selektory CSS na XPath, ponieważ selektory CSS są zwykle o wiele łatwiejsze zarówno do odczytu, jak i zapisu niż zapytania XPath. Na przykład w tym przypadku można użyć obu div[class~="Test"]i div.Testuzyskać ten sam wynik.

Niektóre biblioteki, które udało mi się znaleźć:

• W przypadku JavaScript : css2xpath i css-to-xpath
• Dla PHP : CssSelector Component
• W przypadku Python : cssselect
• Dla C # : css2xpath Reloaded
• Dla GO : css2xpath

Podaję to tylko jako odpowiedź, jak dawno temu Tomalak jako komentarz do odpowiedzi medera

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

Pomocną funkcję można uzyskać z poprzednich odpowiedzi:

function matchClass($className) {
    return "[contains(concat(' ', normalize-space(@class), ' '), ' $className ')]";
}

Następnie po prostu połącz wywołanie funkcji z zapytaniem.

Dopasuj do jednej klasy, która ma spacje.

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

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

możesz znaleźć elementy takie jak ten przykład (wszystkie elementy css)

private By 
allElementsCss = By.xpath(".//div[@class]");