How to use the XPath axes method in Selenium

XPath is a query language used for choosing nodes from an XML document. The link between the current context node and the destination node we wish to find in the DOM axes represent a hierarchy.

Note: See XPath to find out more about it.

List of axes

List of axes
List of axes

Axes and Their Functionalities

Name

Functionality

parent

It identifies the current node’s parent.

child

It selects the children of the current node that are on the same level.

ancestor

It is the current node’s ancestor (grandparents, parents, etc.) till the root node is selected

descendant

It selects all the current node’s descendants until the leaf node has no children.

following

It selects all the incoming nodes after the current node, except the attribute and descendants.

following-sibling

It selects all the same level nodes after the current node, having the same parent.

preceding

It selects all the previous nodes from the current node except the attribute and ancestors.

preceding-sibling

It selects all the same level nodes before the current node, having the same parent.

self

It selects the current node

Using XPath axes

Let’s see an HTML file that shows the hierarchical organization of vehicles. These vehicles are separated into three groups, with examples within each category, as follows.

  • ByLand: Jeep, Cycle, and Truck.

  • ByAir: Airplane, Jet, and Helicopter

  • ByWater: Boat, Submarine, and Ship

<!DOCTYPE html>
<html>
<body>
	<div class="TransportingVehicles" align="center">
		<h2>Transporting Vehicles</h2>
		<div class="ByLand" align="left">
			<h3 align="left">Vehicles transportation by Land </h3>
			<div class="Jeep">
				<h4>Jeep</h4>
			</div>
			<div class="Cyle">
				<h4>Cyle</h4>
			</div>
			<div class="Truck">
				<h4>Truck</h4>
			</div>
		</div>
		<div class="ByAir">
			<h3>Vehicles transportation by Air </h3>
			<div class="Airplane">
				<h4>Airplane</h4>
			</div>
			<div class="Jet">
				<h4>Jet</h4>
			</div>
			<div class="Helicopter">
				<h4>Helicopter</h4>
			</div>
		</div>
		<div class="ByWater">
			<h3>Vehicles transportation by Water </h3>
			<div class="Boat">
				<h4>Boat</h4>
			</div>
			<div class="Submarine">
				<h4>Submarine</h4>
			</div>
			<div class="Ship">
				<h4>Ship</h4>
			</div>
		</div>
	</div>
</body>
</html>
Note: Inspecting the element of the browser (via right-clicking on the element) helps in getting the XPath for each element.

Now, let’s explore a few XPath axes for this HTML file.

The parent axe

//div[@class='Jet']/parent::div

Output

	<div class="ByAir">
		<h3>Vehicles transportation by Air </h3>
		<div class="Airplane">
			<h4>Airplane</h4>
		</div>
		 <div class="Jet">
			<h4>Jet</h4>
		</div>
		<div class="Helicopter">
			<h4>Helicopter</h4>
		</div>
	</div>

The child axe

//div[@class=’ByAir’]/child::div[@class='Jet']/h4

Output

	<div class="ByAir">
		<h3>Vehicles transportation by Air </h3>
		<div class="Airplane">
			<h4>Airplane</h4>
		</div>
		 <div class="Jet">
			<h4>Jet</h4>
		</div>
		<div class="Helicopter">
			<h4>Helicopter</h4>
		</div>
	</div>

The ancestor axe

//div[@class='ByAir']/ancestor::div[@class='TransportingVehicles']

Output

<body>
<div class="TransportingVehicles" align="center">
	<h2>Transporting Vehicles</h2>
	<div class="ByLand" align="left">
		<h3 align="left">Vehicles transportation by Land </h3>
		<div class="Jeep">
			<h4>Jeep</h4>
		</div>
		<div class="Cyle">
			<h4>Cyle</h4>
		</div>
        <div class="Truck">
			<h4>Truck</h4>
		</div>
	</div>
	<div class="ByAir">
		<h3>Vehicles transportation by Air </h3>

The preceding axe

//div[@class='Jet']/preceding::div

Output

		<div class="Cyle">
			<h4>Cyle</h4>
		</div>
        <div class="Truck">
			<h4>Truck</h4>
		</div>
	</div>
	<div class="ByAir">
		<h3>Vehicles transportation by Air </h3>
		<div class="Airplane">
			<h4>Airplane</h4>
		</div>
		<div class="Jet">
			<h4>Jet</h4>
		</div>

Example

In the code example given below, the link provided in the code launches Facebook’s registration page. The code makes use of the child XPath that starts from the registration form and relocates to the “Sign Up” button. When the button is clicked, all the fields show an error because they are empty.

import time
from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
from webdriver_manager.chrome import ChromeDriverManager
from selenium.webdriver.chrome.options import Options
from selenium.webdriver.chrome.service import Service

options = Options()
options.add_argument('--no-sandbox')
options.add_argument('--disable-dev-shm-usage')
prefs = {"download.default_directory": "."}
options.add_experimental_option("prefs", prefs)
browser = webdriver.Chrome(service=Service(ChromeDriverManager().install()), options=options)

BASE_URL = "https://www.facebook.com/r.php"
browser.get(BASE_URL)
print("Facebook page opened.")

# Perform action using ancestor axes
try:
    # Uncomment line 24 and comment line 26 to run Ancestor axes.
    # action_xpath = '*//input[@name="sex"]/ancestor::div[2]//input[@name="lastname"]'

    action_xpath = '*//div[@id="reg_form_box"]/child::div[11]/button'
    action_element = WebDriverWait(browser, 30).until(
        EC.presence_of_element_located((By.XPATH, action_xpath))
    )
    time.sleep(3)
    action_element.click()
    print("Ancestor axes action is performed and clicked.")
    
    # Pause for 10 seconds
    time.sleep(10)
    
except Exception as e:
    print("Failed to perform action using ancestor axes.")

# Close the browser
browser.quit()
XPath for child axes

Explanation

  • Lines 10–15: We set up the options of Chrome and install the browser using webdriver.

  • Lines 17–19: We define the Facebook registration page’s URL and launch the Facebook browser page.

  • Lines 25: We use the XPath of the *//div[@id=“reg_form_box”] element to pick the div where the id is equal to the reg_form_box. The next statement, /child::div[11]/button, narrows it down to the 11th child of this div. Lastly, we click the button to select the direct child of the 11th div from the reg_form_box .

  • Lines 26: We use the WebDriverWait and ExpectedConditions to find the presence of the element pointed by the XPath.

  • Lines 29–30: We use the time.sleep() function to add 3 seconds to see the Selenium automation. We click the button after this.

  • Lines 36–40: We handle any exceptions and finally, close the browser using the browser.quit() function.

Free Resources

Copyright ©2026 Educative, Inc. All rights reserved