How to use Locators to locate Web Element

Everything that is showing on Web Page is the Web Element. Web Element is the Text Box, Button, Text Are, Radio Button, Checkbox, Link, Images, Browser Button, Text, iFrame, pop up window, pop up screen, Confirmation Box, Alert Box all are Web Element. So here i am explaining how to locate Web element by using Locators
1.  By using @id attribute 

Here i am giving an example of Facebook to find out the locators

ID should be unique in the web page. If ID is unique then id is the always first choice to locate the web element.
id="email"
We can write script like driver.findElement(By.id("email"));

2. Locating an Element by Name

 

If ID is not in use then the next locators that can be use is Name attribute. But again Name also should be unique but Name can be use as multiple in the Web Page so be careful before taking Name as a locator.

name="email"

We can write script like driver.findElement(By.name("email"));

3. Locating an Element by LinkText

The link name should be unique in the web page if multiple link name is there then this locators can not work

linkText="Create a Page"

We can write script like driver.findElement(By.linkText("Create a Page"));

4. Location an Element by partial LinkText

 

Again same as LinkText here we can select partial text but that text should be unique to locate the element.

Partial linkText="Create"

We can write script like driver.findElement(By.PartialLinkText("Create")); 

5.Location an element by Tag Name

Tag Name locator is useful where we are locating Web element which is in group so we can use Tag name in Drop Down and Check Box

Tag Name = "select"

Select sel = new Select(driver.findElement(By.tagName("select")) 

sel.selectByValue("2")

6. Locating an Element by Class Name

The Class Name should be unique in the web page. If multiple Class name is there then this location can not work.

Class Name ="inputtext"

We can write script like driver.findElement(By.className("inputtext")); 

7. Locating an element by CSS Selector

syntax of  CSS selector to location an elemenr

tagName[attributeName=attributeValue]

In this example CCS selector will be

input[id=email] then script will be driver.findElement(By.cssSelector("input[id=email]"));

input[class=inputtext] then script will be driver.findElement(By.cssSelector("input[class=inputtext]"));

input[type=email] then script will be driver.findElement(By.cssSelector("input[type=email]"));

input[tabindex=1] then script will be driver.findElement(By.cssSelector("input[tabindex=1]"));

input[name=email] then script will be driver.findElement(By.cssSelector("input[name=email]")); 

8. XPath Locator is also used to locate the element. That is most important method to locate the element because if all above 7 failed to identify the web element then XPath will be used to locate an element so we will discuss regarding XPath in my next article.