HTML XPath Searching by class and text
//span[contains(@class, 'myclass') and text() = 'qwerty']
or
//span[contains(@class, 'myclass') and normalize-space(text()) = 'qwerty']
XPath for class and other attribute values together?
This XPath illustrates all of the concepts of your three-part question:
//a[contains(concat(' ',@class,' '), ' classA ')]
[contains(concat(' ',@class,' '), ' classB ')]
[contains(concat(' ',@class,' '), ' classC ')]
[@href='https://twitter.com/JSTOR']
[@target='_blank']
Notes:
- The
@class
tests preventclassA
from matchingclassAnt
. - You can use
and
to join your conditions in a single predicate rather than compound predicates.
Xpath: select div that contains class AND whose specific child element contains text
To find a div
of a certain class that contains a span
at any depth containing certain text, try:
//div[contains(@class, 'measure-tab') and contains(.//span, 'someText')]
That said, this solution looks extremely fragile. If the table happens to contain a span
with the text you're looking for, the div
containing the table will be matched, too. I'd suggest to find a more robust way of filtering the elements. For example by using IDs or top-level document structure.
XPath for two different classes?
This XPath,
//div[@class="one" or @class="two"]
will select all div
elements with @class
attribute values of "one"
or "two"
.
For a more robust matching of @class
that takes into account that @class
attribute values can be space-separate lists, see this approach.
XPath using classname and contains text
For a demonstration consider the following HTML:
<div class="credit_summary_item">Professor</div>
There is:
- Only one value of the class attribute i.e.
credit_summary_item
. - And the innerText i.e. Professor contains no leading and trailing spaces.
So, to locate this element you can use either of the following solutions:
Using
text()
://div[@class='credit_summary_item' and text()='Professor']
Using
contains()
://div[@class='credit_summary_item' and contains(., 'Professor')]
This usecase
But in your usecase it seems contains(@class, 'credit_summary_item')
worked which implies the element have multiple classes. So apart from credit_summary_item
there are some other values present as class attributes.
How can I find an element by CSS class with XPath?
This selector should work but will be more efficient if you replace it with your suited markup:
//*[contains(@class, 'Test')]
Or, since we know the sought element is a div
:
//div[contains(@class, 'Test')]
But since this will also match cases like class="Testvalue"
or class="newTest"
, @Tomalak's version provided in the comments is better:
//div[contains(concat(' ', @class, ' '), ' Test ')]
If you wished to be really certain that it will match correctly, you could also use the normalize-space function to clean up stray whitespace characters around the class name (as mentioned by @Terry):
//div[contains(concat(' ', normalize-space(@class), ' '), ' Test ')]
Note that in all these versions, the * should best be replaced by whatever element name you actually wish to match, unless you wish to search each and every element in the document for the given condition.
Related Topics
How to Set a Background-Color For the Width of Text, Not the Width of the Entire Element, Using Css
Text-Overflow Is Not Working When Using Display:Flex
What Is Use of 'Initial' Value in Css
Firefox Linux (Centos) Responsive Design Image Scaling
How to Put Text Over Images in HTML
Select Second Last Element with CSS
Send Email from Static Page Hosted on Github Pages
When Should One Use HTML Entities
Fixed Header, Footer With Scrollable Content
What Is "X-Content-Type-Options=Nosniff"
How to Display the Checkbox Over the Images For Selection
Html/Css Hexagon With Image Inside
Font Awesome Icon Inside Text Input Element