# 9j。 WebDriver –定位元素:第1部分(按id,名称,tagName)
> 原文: [https://javabeginnerstutorial.com/selenium/9j-webdriver-locating-elements-1/](https://javabeginnerstutorial.com/selenium/9j-webdriver-locating-elements-1/)
朋友! 如果您进入了硒世界,那么您一定已经遇到了Web Elements! 文本框,按钮,链接,复选框,单选按钮,下拉菜单,警报等,所有内容均视为网络元素。 使用定位器类型和策略,我们可以轻松识别页面上任何所需的元素。 这是与页面进行交互并在代码中进一步引用这些元素的最关键步骤。 是的,它与我们在Selenium IDE 中看到的[非常相似,除了语法和概念的应用方式。](https://javabeginnerstutorial.com/selenium/7k-ide-locating-elements/)
使用Selenium webDriver定位Web元素的一般语法是:
```java
driver.findElement(By.LocatorStrategyType ("Locator_Value"));
```
**说明:**
* *驱动程序* –实现WebDriver接口的相应驱动程序类的实例变量
* *findElement()* –查找并返回具有指定位置策略的第一个Web元素
* *findElements()* –查找并返回与给定位置策略匹配的Web元素列表
* *按* –始终使用按类别定位目标
* *LocatorStrategyType* – ID,名称,标记名,类名,cssSelector,linkText,partialLinkText,xpath是可用于在页面上定位元素的某些定位器类型
* *Locator_Value* –可以标识元素的value / HTML标记
#### 可用的定位器类型包括:
* ID
* Name
* 标签名
* 班级名称
* LinkText
* partialLinkText
* cssSelector
* 路径
可以随时通过编程方式掌握页面上所需的元素,但要实现此目的,我们的创作方可能不得不偷看一下。 原因是,我们并不总是可以控制页面上的HTML。 这就是为什么我们有这么多的定位器类型,而且绝对没有理由惊慌!
让我们继续,并通过代码示例详细了解每种定位器类型。
## *通过ID* 定位
id是在页面上定位元素的最有用和首选的方式,因为它是唯一的。 但是,当心! 一些开发人员要么自动生成这些ID,要么完全忘记添加一个。 那就是我们去寻找其他定位器类型的时候。
***语法**:* *driver.findElement(By.id(“ element_id”));*
***说明**:*找到具有匹配id属性的第一个元素。
***示例**:*打开Google帐户创建页面。 让我们通过ID识别名字文本框。
* Google Chrome –右键单击要确定其ID的网络元素,然后选择“检查”。 或通过单击F12打开开发人员工具,单击左上角的检查元素图标,然后在页面上单击所需的Web元素。 两种方法都将突出显示与所选元素相对应的HTML代码。
* Mozilla Firefox –右键单击Web元素,然后选择“使用Firebug检查元素”(以防您错过了 [Firebug安装和使用](https://javabeginnerstutorial.com/selenium/7n-ide-using-firebug/) 上的帖子)。 或者,如果您确实不想使用Firebug,则右键单击该元素并选择“检查元素”。 在两种情况下,都将打开并突出显示相应的HTML代码。
![Locating by Id](img/c073039501d98689d51ef3a4addb1095.png)
如上面的屏幕截图所示,“名字”文本框的ID为“名字”。 因此,此处使用的代码是
```java
driver.findElement(By.id("FirstName"));
```
## *按名称定位*
Name属性也可用于在页面上定位元素。
***语法**:* *driver.findElement(By.name(“ element_name”));*
***说明**:*找到具有匹配名称属性的第一个元素。
***示例**:*让我们按名称标识姓氏文本框。
右键单击姓氏文本框,然后单击检查元素以获取相应的HTML代码。 在我们的案例中,name属性的值为LastName。 因此,按名称定位此网络元素的代码将是,
```java
driver.findElement(By.name("LastName"));
```
![Locating by Name](img/db99d6c97b75004afe20751036b629d8.png)
## *通过标记名* 定位
在这里,我们使用标记的实际名称,例如<,>作为锚,<表>作为表。 当我们想要获得具有给定标签名称的所有元素时,这很有用。 如果被测页面只有一个标签,则findElement将起作用。 但否则,建议对结果建立索引以找到我们希望使用的特定元素。
***语法**:* *driver.findElements(By.tagName(“ element_html_tag”));;*
***说明**:*找到具有匹配标签名称的所有元素。
***示例**:*让我们找到Gmail帐户创建页面右上角的“登录”按钮。
右键单击按钮,然后单击检查元素以获取相应的HTML代码。 我们可以看到它具有锚标记。 让我们继续并在列表中获取所有具有tagName“ a”的网络元素,然后通过其索引找到第一个元素,以便与“登录”按钮进行交互。
```java
// List of all elements with anchor tag
List buttons = driver.findElements(By.tagName("a"));
// Locate 'Sign in' button by indexing the list
WebElement signInButton = buttons.get(0);
```
## 总体图片
为了避免在尝试使用这些定位器时可能遇到的意外意外,让我们看一个实现上述定位器类型的测试用例。
#### *场景*
1. 打开Firefox浏览器。
2. 导航到Google帐户创建页面
3. 通过ID找到名字文本框
4. 输入“ fname01”作为名字
5. 按名称找到姓氏文本框
6. 输入“ lname01”作为姓氏
7. 使用tagName找到“登录”按钮
8. 将按钮文字打印到控制台进行验证
此方案的JUnit代码是,
```java
import java.util.List;
import java.util.concurrent.TimeUnit;
import org.junit.After;
import org.junit.Before;
import org.junit.Test;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;
public class ElementLocatorTest1 {
//Declaring variables
private WebDriver driver;
private String baseUrl;
@Before
public void setUp() throws Exception{
// Selenium version 3 beta releases require system property set up
System.setProperty("webdriver.gecko.driver", "E:\\Softwares\\"
+ "Selenium\\geckodriver-v0.10.0-win64\\geckodriver.exe");
// Create a new instance for the class FirefoxDriver
// that implements WebDriver interface
driver = new FirefoxDriver();
// Implicit wait for 5 seconds
driver.manage().timeouts().implicitlyWait(5, TimeUnit.SECONDS);
// Assign the URL to be invoked to a String variable
baseUrl = "https://accounts.google.com/SignUp";
}
@Test
public void testPageTitle() throws Exception{
// Open baseUrl in Firefox browser window
driver.get(baseUrl);
// Locate First Name text box by id and
// assign it to a variable of type WebElement
WebElement firstName = driver.findElement(By.id("FirstName"));
// Clear the default placeholder or any value present
firstName.clear();
// Enter/type the value to the text box
firstName.sendKeys("fname01");
// Locate last name text box by name
WebElement lastName = driver.findElement(By.name("LastName"));
// Clear and enter a value
lastName.clear();
lastName.sendKeys("lname01");
// List of all elements with anchor tag
List buttons = driver.findElements(By.tagName("a"));
// Locate 'Sign in' button by indexing the list
WebElement signInButton = buttons.get(0);
// Verifying if the button is located
System.out.println("First button text: " + signInButton.getText());
}
@After
public void tearDown() throws Exception{
// Close the Firefox browser
driver.close();
}
}
```
#### *解释*
将导入两个新的软件包,
**导入** org.openqa.selenium.WebElement –实例化一个新的Web元素。
**导入** org.openqa.selenium.By; –该包引用了被称为定位器类型的By类。
注释清楚地提供给每一行代码,因此很容易解释。
![Output1](img/125542272ed942fe903e270ac7bb44bb.png)
执行测试用例后,成功显示为绿色,并且输出显示在控制台上,确认“登录”按钮与tagName一起位于。 图像的右半部分显示了在Firefox浏览器中执行的自动输出。 名字和姓氏文本框将填充代码中给出的值。
让我们在这里休息一下。 在下面的文章中,我们将通过示例看到另外三种查找元素的方法。 蒙克就这些想法直到那时!
祝你今天愉快!
###### 下一篇文章
##### [9k。 WebDriver –定位元素:第2部分(按className,linkText,partialLinkText)](https://javabeginnerstutorial.com/selenium/9k-webdriver-locating-elements-2/ "9k. WebDriver – Locating elements: Part 2 (by className, linkText, partialLinkText)")