Using Xpaths we can identify element location through nodes and attributes in XML document. There are basically 2 types of Xpaths:

1. Absolute Xpath: It starts from the root path.

For e.g. the absolute path for the element highlighted below in the screenshot is: /html/body/div[1]/header/nav/ul/li[1]/a

Working with Xpaths_01

2. Relative Xpath: It can start from anywhere in the XML document.

For the same element highlighted above, we can write the relative xpath as:

      //ul[@id=’jsddm’]/li/a

 

By looking at the examples above, we can observe that absolute xpath uses single slash (/) at the start which indicates that Xpath engine will look for element starting from root node. While relative xpath uses double slash (//) at the start which indicates that Xpath engine will look for element from anywhere in the XML.

 

Creating Xpaths using different attributes

We can create xpaths from any attribute using the syntax:

//TagName[@AttributeName=’AttributeValue’]

 

Referring the screenshot below, we can create the xpath for the same in different ways:

Working with Xpaths_02

  1. //div[@id=’main’]
  2. //div[@class=’content’]
  • //div[@data-jiis=’cc’]

 

Suppose we want to create xpath using element text, we can follow the syntax as:

//TagName[text()=’ElementText’]

Referring the screenshot below, we can create the xpath as:

Working with Xpaths_03

//a[text()=’Mail’]

 

Match by Sub-string

We can use the following methods to handle dynamically generated values or if we want to locate elements with sub-strings:

  1. contains keyword:

The syntax for the same is:

  1. //TagName[contains(@AttributeName, ‘AttributeValue’)] : We can use this if we want to use attribute value. For e.g. //div[contains(@class, ‘proid’)]
  2. //TagName[contains(text(), ‘partialtext’)] : We can use this if we want to use partial text. For e.g. //div[contains(text(), ‘logica’)]

 

  1. starts-with keyword:

The syntax for the same is:

  1. //TagName[starts-with(@AttributeName, ‘AttributeValue’)] : We can use this if we want to use starting text of attribute value. For e.g. //div[starts-with(@class, ‘pro’)]
  2. //TagName[starts-with(text(), ‘startingtext’)] : We can use this if we want to use partial starting text. For e.g. //div[starts-with(text(), ‘log’)]

 

Creating Xpaths using multiple attributes

We can create a xpath using multiple attributes within that element. For e.g.

Working with Xpaths_04

Here we can write the xpath as: //input[@id=’gbqfq’ and @autocomplete=’off’]

 

Using Xpaths to select parent node

Now refer the image below:

Working with Xpaths_05

From the highlighted element path i.e. //div[@id=’hdtb_msb’], if we want to go to the parent node, then we can write the xpath expression as:

//div[@id=’hdtb_msb’]/..

This will select the parent node having the path: //div[@id=’hdtb_s’]

If we want to select the 2nd child node i.e. the ol element, we can write the xpath expression as:

//div[@id=’hdtb_msb’]/../ol

You can also refer my blog on CSS selectors where I have explained different ways of using it.

All the best! J