Relative XPath is an XPath expression used in Selenium WebDriver to locate web elements without specifying the complete path from the root of the HTML document. Instead of following every level of the DOM hierarchy, Relative XPath starts from a particular point and identifies the required element using tag names, attributes, text, indexes, relationships, or other XPath functions.
Relative XPath is commonly used for locating web elements such as input fields, buttons, links, checkboxes, dropdowns, forms, tables, and dynamically generated elements. Selenium training at JustAcademy includes locators such as XPath and CSS selectors as part of Selenium WebDriver and web-element automation. JustAcademy Selenium Training Course
You can also visit the Selenium Course Demo Registration page for course-demo information.
Relative XPath is an XPath expression that locates an element from a specific point in the DOM instead of starting from the root of the HTML document.
The most common Relative XPath syntax starts with double forward slashes:
//tagnameFor example:
//inputThis expression searches for input elements in the document without specifying the complete HTML hierarchy.
The general syntax of Relative XPath is:
//tagnameRelative XPath can also use attributes:
//tagname[@attribute='value']Example:
//input[@id='username']This XPath searches for an input element whose ID attribute is username.
Relative XPath provides a flexible way to locate web elements without depending on the complete DOM hierarchy.
It can be used to:
Absolute XPath follows the complete path from the root of the HTML document.
/html/body/div/form/inputRelative XPath identifies the element without specifying the complete path.
//inputA more specific Relative XPath can be:
//input[@id='username']Relative XPath commonly starts with two forward slashes.
//input
//button
//a
//div
//form
The double slash allows XPath to search for matching elements anywhere in the document relative to the current context.
The simplest Relative XPath uses only the tag name.
//inputThis searches for input elements.
Other examples:
//button
//a
//div
//form
//table
//tr
//td
When many elements have the same tag name, additional conditions should be used to identify the required element.
An ID is one of the most commonly used attributes with Relative XPath.
Consider:
<input id="username" type="text">The Relative XPath is:
//input[@id='username']Selenium example:
driver.findElement(By.xpath("//input[@id='username']")).sendKeys("admin");The name attribute can also be used to identify an element.
<input type="text" name="username">XPath:
//input[@name='username']Selenium:
driver.findElement(By.xpath("//input[@name='username']")).sendKeys("admin");The class attribute can be used to locate an element.
<input class="login-input" type="text">XPath:
//input[@class='login-input']Selenium:
driver.findElement(By.xpath("//input[@class='login-input']")).sendKeys("admin");When an element contains multiple classes, exact class matching may not always be suitable. In such cases, contains() can be useful.
Multiple attributes can be combined when one attribute is not sufficient to identify an element uniquely.
HTML:
<input id="username" name="user" type="text">XPath:
//input[@id='username' and @name='user']Selenium:
driver.findElement(
By.xpath("//input[@id='username' and @name='user']")
);
The and operator is used when multiple conditions must be true.
//input[@type='text' and @name='username']This XPath searches for an input element where both conditions are satisfied.
The or operator can be used when either of the conditions can identify the element.
//input[@id='username' or @name='username']This XPath matches an input where either the ID or name matches username.
The text() function can locate an element based on its visible text.
HTML:
<button>Login</button>XPath:
//button[text()='Login']Selenium:
driver.findElement(By.xpath("//button[text()='Login']")).click();The contains() function can be used when only part of the visible text is known.
HTML:
<button>Login to Application</button>XPath:
//button[contains(text(),'Login')]This can match a button containing the word Login.
The contains() function is useful when an attribute value is dynamic or only part of the value is stable.
HTML:
<input id="user_12345" type="text">XPath:
//input[contains(@id,'user_')]This XPath searches for an input whose ID contains user_.
The starts-with() function can identify elements whose attribute value starts with a specific string.
HTML:
<input id="username_12345" type="text">XPath:
//input[starts-with(@id,'username_')]This is useful when an application generates dynamic IDs with a stable prefix.
The normalize-space() function removes leading and trailing whitespace and normalizes whitespace in text.
Example:
//button[normalize-space()='Login']This can be useful when the visible text contains unnecessary spaces or formatting differences.
Indexes can be used when multiple elements match the same XPath.
For example:
(//input)[1]This selects the first input matching the expression.
(//input)[2]This selects the second input.
Indexes should be used carefully because the position of elements can change when the DOM changes.
The position() function can be used to identify an element at a particular position.
//input[position()=1]Another example:
//input[position()=2]This can be useful when working with multiple similar elements.
Consider:
<button id="loginBtn">Login</button>Possible XPath expressions are:
//button[@id='loginBtn']Or:
//button[text()='Login']Or:
//button[contains(text(),'Login')]Selenium example:
driver.findElement(By.xpath("//button[@id='loginBtn']")).click();HTML:
<a href="/home">Home</a>XPath using text:
//a[text()='Home']XPath using href:
//a[@href='/home']XPath using contains:
//a[contains(@href,'home')]HTML:
<input type="checkbox" id="terms">XPath:
//input[@id='terms']Selenium:
driver.findElement(By.xpath("//input[@id='terms']")).click();HTML:
<input type="radio" name="gender" value="male">XPath:
//input[@type='radio' and @value='male']Selenium:
driver.findElement(
By.xpath("//input[@type='radio' and @value='male']")
).click();
HTML:
<select id="country">
<option>India</option>
<option>USA</option>
</select>
Select element:
//select[@id='country']Option:
//select[@id='country']/option[text()='India']Consider:
<form id="loginForm">
<input name="username">
<input name="password">
<button>Login</button>
</form>
Username:
//form[@id='loginForm']//input[@name='username']Password:
//form[@id='loginForm']//input[@name='password']Login button:
//form[@id='loginForm']//button[text()='Login']The parent axis can be used to move from an element to its parent.
HTML:
<div class="login">
<input id="username">
</div>
XPath:
//input[@id='username']/parent::divThis XPath locates the div parent of the username input.
The child relationship can be used to navigate from a parent element to a child element.
//div[@class='login']/child::inputA shorter equivalent form can be:
//div[@class='login']/inputThe ancestor axis finds an element above the current element in the DOM hierarchy.
//input[@id='username']/ancestor::formThis locates the form ancestor of the username input.
The descendant axis locates elements anywhere below the current element.
//form[@id='loginForm']/descendant::inputThis finds input elements that are descendants of the login form.
The following-sibling axis locates sibling elements that appear after the current element.
HTML:
<div>
<label>Username</label>
<input type="text">
</div>
XPath:
//label[text()='Username']/following-sibling::inputThe preceding-sibling axis locates sibling elements that appear before the current element.
//input[@id='username']/preceding-sibling::labelThis can locate the label that appears before the username input.
The following axis selects nodes that appear after the current node in the document.
//label[text()='Username']/following::inputThis can locate input elements appearing after the username label.
The preceding axis selects nodes that occur before the current node in the document.
//input[@id='password']/preceding::inputThis can locate input elements appearing before the password input.
The double slash can also be used to locate descendants without specifying every intermediate element.
//div[@id='login']//inputThis searches for input elements anywhere inside the div with ID login.
Multiple conditions can be combined to create a more specific locator.
//input[@type='text' and @name='username' and @placeholder='Enter Username']This XPath matches an input where all three conditions are satisfied.
The not() function can be used when a specific attribute value should be excluded.
//input[not(@disabled)]This expression identifies input elements that do not have the disabled attribute.
Multiple conditions can also be applied to visible text.
//button[contains(text(),'Login') and not(@disabled)]This can identify a button containing Login that is not disabled.
Dynamic web applications sometimes generate changing ID values.
For example:
<input id="user_12345" type="text">On another page load, it may become:
<input id="user_67890" type="text">An XPath using contains() can focus on the stable part:
//input[contains(@id,'user_')]Dynamic applications may also generate changing class names.
<button class="btn-login-123">Login</button>XPath:
//button[contains(@class,'btn-login')]This focuses on the stable portion of the class value.
When text contains additional spaces, normalize-space() can make the XPath more reliable.
HTML:
<button> Login </button>XPath:
//button[normalize-space()='Login']Relative XPath is useful for navigating tables.
HTML:
<table id="employees">
<tbody>
<tr>
<td>John</td>
<td>QA Tester</td>
</tr>
</tbody>
</table>
First cell:
//table[@id='employees']//tr[1]/td[1]Second cell:
//table[@id='employees']//tr[1]/td[2]Suppose a table contains employee information:
<tr>
<td>John</td>
<td>QA Tester</td>
<td>Mumbai</td>
</tr>
The XPath for the row containing John can be:
//tr[td[text()='John']]The city cell in the same row can be located using:
//tr[td[text()='John']]/td[3]Suppose:
<div>
<span>Username</span>
<input type="text">
</div>
The input can be located relative to the Username text:
//span[text()='Username']/following-sibling::inputThis approach is useful when the input itself does not have a unique attribute.
Selenium uses the By.xpath() locator to work with Relative XPath.
WebElement username = driver.findElement(
By.xpath("//input[@id='username']")
);
The element can then be used for further automation actions.
The sendKeys() method can enter text into an element located using Relative XPath.
driver.findElement(
By.xpath("//input[@id='username']")
).sendKeys("admin");
The click() method can be used after locating a button or link.
driver.findElement(
By.xpath("//button[@id='loginBtn']")
).click();
The getText() method retrieves visible text from an element.
String message = driver.findElement(
By.xpath("//div[@class='success-message']")
).getText();
System.out.println(message);
The getAttribute() method can retrieve attribute values.
String value = driver.findElement(
By.xpath("//input[@id='username']")
).getAttribute("value");
System.out.println(value);
findElements() can locate multiple elements matching a Relative XPath.
List<WebElement> inputs = driver.findElements(
By.xpath("//input")
);
System.out.println(inputs.size());
Relative XPath can be used with explicit waits when an element needs to become available before interaction.
WebDriverWait wait =
new WebDriverWait(driver, Duration.ofSeconds(10));
WebElement loginButton = wait.until(
ExpectedConditions.elementToBeClickable(
By.xpath("//button[@id='loginBtn']")
)
);
loginButton.click();
JustAcademy's Selenium curriculum includes waits, synchronization, dynamic elements, and stable test execution strategies as part of Selenium automation training. Explore Selenium Training
Relative XPath locators can be stored in Page Object Model classes.
public class LoginPage {
private WebDriver driver;
private By username =
By.xpath("//input[@id='username']");
private By password =
By.xpath("//input[@id='password']");
private By loginButton =
By.xpath("//button[@id='loginBtn']");
public LoginPage(WebDriver driver) {
this.driver = driver;
}
public void login(String user, String pass) {
driver.findElement(username).sendKeys(user);
driver.findElement(password).sendKeys(pass);
driver.findElement(loginButton).click();
}
}
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
public class RelativeXPathExample {
public static void main(String[] args) {
WebDriver driver = new ChromeDriver();
driver.get("https://example.com/login");
driver.findElement(
By.xpath("//input[@id='username']")
).sendKeys("admin");
driver.findElement(
By.xpath("//input[@id='password']")
).sendKeys("admin123");
driver.findElement(
By.xpath("//button[@id='loginBtn']")
).click();
driver.quit();
}
}
| Feature | Absolute XPath | Relative XPath |
|---|---|---|
| Starting Point | Starts from the root | Can locate from a selected context |
| Common Syntax | /html/body/div | //div |
| Path | Complete DOM path | Targeted path |
| Length | Usually longer | Usually shorter |
| DOM Dependency | Highly dependent on hierarchy | Can use attributes and relationships |
| Dynamic Pages | Can be sensitive to structural changes | Can be constructed around stable attributes |
| Example | /html/body/div/form/input | //input[@id='username'] |
| Feature | Relative XPath | ID Locator |
|---|---|---|
| Selenium Method | By.xpath() | By.id() |
| Identification | Can use attributes, text, relationships, and functions | Uses ID attribute |
| Flexibility | High | Depends on ID availability |
| Example | //input[@id='username'] | username |
Example:
$x("//input[@id='username']")Another example:
$x("//button[text()='Login']")A good XPath should identify the intended element without unexpectedly matching unrelated elements.
In Chrome Console:
$x("//input[@id='username']")If one intended element is returned, the expression can be investigated as a unique locator.
If multiple elements are returned, make the XPath more specific.
//form[@id='loginForm']//input[@id='username']Relative XPath can be useful when:
Dynamic web elements can have changing IDs, classes, or other attributes. Relative XPath can be constructed using stable portions of those values.
Example:
<button id="submit_12345">Submit</button>Instead of depending on the complete dynamic value, use:
//button[contains(@id,'submit_')]This expression focuses on the stable part of the attribute.
Labels can be useful reference points when input fields do not have unique attributes.
HTML:
<div>
<label>Email</label>
<input type="email">
</div>
XPath:
//label[text()='Email']/following-sibling::inputThis finds the input associated with the Email label based on the sibling relationship.
<form id="loginForm">
<label>Username</label>
<input id="username" type="text">
<label>Password</label>
<input id="password" type="password">
<button id="loginBtn">Login</button>
</form>
Relative XPath expressions:
//form[@id='loginForm']//input[@id='username']
//form[@id='loginForm']//input[@id='password']
//form[@id='loginForm']//button[@id='loginBtn']
Open Browser
↓
Open Web Application
↓
Inspect Required Element
↓
Identify Stable Attribute or Relationship
↓
Create Relative XPath
↓
Validate XPath in Browser
↓
Use By.xpath()
↓
Locate WebElement
↓
Perform Action
↓
Validate Result
↓
Continue Test Execution
| Purpose | Example |
|---|---|
| Tag Name | //input |
| ID | //input[@id='username'] |
| Name | //input[@name='username'] |
| Class | //input[@class='login-input'] |
| Text | //button[text()='Login'] |
| Contains Text | //button[contains(text(),'Login')] |
| Contains Attribute | //input[contains(@id,'user')] |
| Starts With | //input[starts-with(@id,'user_')] |
| Multiple Conditions | //input[@type='text' and @name='username'] |
| First Element | (//input)[1] |
| Parent | //input[@id='username']/parent::div |
| Ancestor | //input[@id='username']/ancestor::form |
| Following Sibling | //label[text()='Username']/following-sibling::input |
| Descendant | //form[@id='loginForm']/descendant::input |
Create a login page containing:
Create Relative XPath expressions for each element.
//input[@id='username']
//input[@id='password']
//input[@type='checkbox']
//button[text()='Login']
//a[contains(text(),'Forgot Password')]
Validate every XPath using:
$x("YOUR_XPATH")import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
public class RelativeXPathAutomation {
public static void main(String[] args) {
WebDriver driver = new ChromeDriver();
driver.get("https://example.com/login");
WebElement username = driver.findElement(
By.xpath("//input[@id='username']")
);
WebElement password = driver.findElement(
By.xpath("//input[@id='password']")
);
WebElement loginButton = driver.findElement(
By.xpath("//button[@id='loginBtn']")
);
username.sendKeys("admin");
password.sendKeys("admin123");
loginButton.click();
driver.quit();
}
}
Relative XPath is an XPath expression used to locate an element without specifying its complete path from the root of the HTML document.
Relative XPath commonly starts with double forward slashes.
////input[@id='username']Absolute XPath follows the complete hierarchy from the root, while Relative XPath can locate an element using attributes, text, relationships, functions, and other targeted conditions.
Yes. Attributes such as ID, name, class, type, href, and other HTML attributes can be used.
Yes. The text() function can be used to locate elements based on their visible text.
contains() is an XPath function used to match a partial value of an attribute or text.
starts-with() matches an attribute value that begins with a specified string.
Yes. Indexes can be used to identify a specific element among multiple matching elements.
Relative XPath can be tested in the browser Console using the $x() function.
Yes. It can be constructed using stable portions of dynamic attributes, text, and element relationships.
Yes. Selenium WebDriver supports Relative XPath through By.xpath().
Relative XPath is an important Selenium locator technique that allows testers to locate web elements without depending on the complete path from the HTML root. It can identify elements using attributes, visible text, partial values, indexes, parent-child relationships, sibling relationships, and XPath functions.
Relative XPath is especially useful when creating Selenium automation scripts because it allows testers to build targeted locators around meaningful and stable characteristics of web elements. It can also be used with dynamic web elements when the XPath is designed around stable portions of their attributes or relationships.
JustAcademy's Selenium Automation Testing course covers Selenium WebDriver, locators including XPath and CSS selectors, WebElements, browser automation, waits, dynamic elements, TestNG, Page Object Model, framework development, and practical automation projects. Explore JustAcademy Selenium Training.
For additional course information, visit the JustAcademy Selenium Course Demo Registration page.
