本节介绍的元素定位方式基本涵盖了 Selenium 的所有元素定位方式，但并不是所有的元素定位方式都适用于所有的场景，需要根据具体的情况来选择合适的元素定位方式。

前言

本节将介绍 Selenium 的元素定位方式与 WebElements。

知识点

  • Selenium 元素定位方式

  • Selenium 定位复数元素

  • WebElements 对象

Selenium 元素定位方式

在 Selenium 中，有 8 种元素定位方式，分别是：

  • 通过 ID 定位

  • 通过 Name 定位

  • 通过 Class Name 定位

  • 通过 Tag Name 定位

  • 通过 Link Text 定位

  • 通过 Partial Link Text 定位

  • 通过 XPath 定位

  • 通过 CSS Selector 定位

当使用 Selenium 进行元素定位时，find_element_by_ 方法在新版中已被弃用，推荐使用 find_element(By.XX, '') 的方式进行元素定位。

通过 ID 定位

通过元素的 ID 属性来唯一标识并定位元素。

1
element = driver.find_element(By.ID, 'id')

通常情况下，ID 属性是唯一的，因此通过 ID 定位元素是最快的。可以通过查看网页源代码或者使用开发者工具来获取元素的 ID。在 HTML 中，元素的 ID 通常以 “id” 属性显示，如下所示：

1
<div id="uniqueId">这是一个示例元素</div>

在这个例子中，uniqueId 是该元素的 ID。可以使用该 ID 来定位元素，如下所示：

1
element = driver.find_element(By.ID, 'uniqueId')

从开发者工具中可以看到，百度首页的搜索框的 ID 为 kw。

通过 Name 定位

通过元素的 Name 属性来唯一标识并定位元素。

1
element = driver.find_element(By.NAME, 'name')

在 HTML 中，name 属性通常用于表单元素，如下所示：

1
<input type="text" name="username" />

在这个例子中，username 是该元素的 name。可以使用该 name 来定位元素，如下所示：

1
element = driver.find_element(By.NAME, 'username')

从开发者工具中可以看到，百度首页的搜索框的 Name 为 wd。

通过 Class Name 定位

通过元素的 Class Name 属性来唯一标识并定位元素。

1
element = driver.find_element(By.CLASS_NAME, 'class_name')

与 ID 不同，class 属性并不要求在 HTML 中是唯一的。一个 HTML 文档中可以有多个元素具有相同的 class 属性值。class 属性通常用于为多个元素应用相同的样式或标识它们属于相同的类别。

示例：

1
2
3
<div class="box">这是一个样式为box的元素。</div>
<p class="paragraph">这是一个样式为paragraph的段落。</p>
<div class="box">这是另一个样式为box的元素。</div>

在这个例子中，两个 div 元素都具有相同的 class 属性值 “box”，这允许它们共享相同的样式。p 元素具有 class 属性值 “paragraph”，使其可以独立于其他元素样式。

虽然 class 属性不要求是唯一的，但在某些情况下，开发者可能会选择确保 class 的唯一性，以便更容易选择和定位特定的元素。在 Selenium 或其他自动化测试工具中，可以通过 class 属性来定位元素，例如：

1
element = driver.find_element(By.CLASS_NAME, 'box')

这将返回具有 class 属性值为 “box” 的第一个元素。

通过 Tag Name 定位

通过元素的 Tag Name 属性来唯一标识并定位元素。

1
element = driver.find_element(By.TAG_NAME, 'tag_name')

tag name 是一种在 HTML 中定位元素的方式，通过指定元素的标签名来选择元素。标签名通常指的是 HTML 元素的名称，例如 <div>、<p>、<a> 等。

示例：

1
2
3
<div>This is a div element.</div>
<p>This is a paragraph element.</p>
<a href="#">This is a link element.</a>

在这个例子中，<div>、<p>、<a> 分别是不同的标签名。

在 Selenium 中，可以使用 find_element 方法结合 By.TAG_NAME 来通过标签名定位元素，例如：

1
2
3
element_div = driver.find_element(By.TAG_NAME, 'div')
element_p = driver.find_element(By.TAG_NAME, 'p')
element_a = driver.find_element(By.TAG_NAME, 'a')

这样可以分别选择页面上的 <div>、<p> 和 <a> 元素。需要注意的是，find_element 方法只返回匹配到的第一个元素。

通过 Link Text 定位

通过元素的 Link Text 属性来唯一标识并定位元素。

1
element = driver.find_element(By.LINK_TEXT, 'link_text')

Link Text 是 Selenium 中用于通过超链接文本来定位元素的一种方式。这主要用于定位 <a>（锚）元素，也就是页面上的链接。

示例：

1
<a href="https://www.example.com">Link</a>

在这个例子中，”Link” 是链接的文本。

在 Selenium 中，可以使用 find_element 方法结合 By.LINK_TEXT 来通过链接文本定位元素，例如：

1
element_link = driver.find_element(By.LINK_TEXT, 'Link')

这将返回具有指定链接文本的 <a> 元素。需要注意的是，LINK_TEXT 是大小写敏感的，确保文本与链接实际显示的文本完全匹配。

如果页面中有多个相同文本的链接，LINK_TEXT 只会返回第一个匹配的元素。

通过 Partial Link Text 定位

Partial Link Text 是 Selenium 中用于通过链接文本的部分内容来定位元素的一种方式。与 Link Text 不同，Partial Link Text 允许使用链接文本的部分匹配。

在 Selenium 中，可以使用 find_element 方法结合 By.PARTIAL_LINK_TEXT 来通过部分链接文本定位元素，例如：

1
element = driver.find_element(By.PARTIAL_LINK_TEXT, 'Partial Link')

这将返回具有包含 “Partial Link” 文本的链接元素。需要注意的是，PARTIAL_LINK_TEXT 是大小写敏感的，确保部分文本与链接实际显示的文本的一部分完全匹配。

这种方式对于处理动态生成的链接文本或者只关注链接文本的一部分的情况很有用。如果页面中有多个匹配的元素，PARTIAL_LINK_TEXT 只会返回第一个匹配的元素。

通过 XPath 定位

XPath 可能会包含双引号，因此在使用 XPath 时，建议使用单引号来包含 XPath。

通过元素的 XPath 属性来唯一标识并定位元素。

1
element = driver.find_element(By.XPATH, 'xpath')

XPath（XML Path Language）是一种用于在 XML 文档中定位元素的语言。在 HTML 文档中，XPath 同样可以用于定位元素。XPath 提供了灵活而强大的选择元素的方式，可以通过元素的层次结构、属性、文本内容等来定位。

在 Selenium 中，可以使用 find_element 方法结合 By.XPATH 来通过 XPath 表达式定位元素。以下是一些 XPath 定位的示例：

  1. 通过绝对路径定位元素：
1
element = driver.find_element(By.XPATH, '/html/body/div[1]/p[2]')

这里通过绝对路径指定了元素的位置。

  1. 通过相对路径定位元素：
1
element = driver.find_element(By.XPATH, '//div[@class="example"]/p')

这里使用相对路径结合属性条件来定位元素。

  1. 通过文本内容定位元素：
1
element = driver.find_element(By.XPATH, '//*[text()="Click me"]')

这里使用 text() 函数来匹配文本内容为 “Click me” 的任何元素。

  1. 通过属性值定位元素：
1
element = driver.find_element(By.XPATH, '//*[@id="exampleId"]')

这里通过元素的 id 属性值来定位元素。

XPath 提供了更多的功能和选择方式，可以根据具体的需求来编写 XPath 表达式。在编写 XPath 表达式时，可以使用浏览器的开发者工具来辅助查找元素的路径。

在开发者工具中，可以通过右键点击元素，然后选择 Copy -> Copy XPath 来复制元素的 XPath。

通过 CSS Selector 定位

通过元素的 CSS Selector 属性来唯一标识并定位元素。

1
element = driver.find_element(By.CSS_SELECTOR, 'css_selector')

CSS Selector 是一种用于选择 HTML 元素的模式。在 Selenium 中，可以使用 find_element 方法结合 By.CSS_SELECTOR 来通过 CSS Selector 定位元素。CSS Selector 提供了一种简洁而强大的方式来定位元素，可以根据元素的 ID、类名、标签名、属性等进行选择。

以下是一些 CSS Selector 定位的示例：

  1. 通过 ID 定位元素：
1
element = driver.find_element(By.CSS_SELECTOR, '#exampleId')

这里使用 # 符号来指定 ID。

  1. 通过类名定位元素：
1
element = driver.find_element(By.CSS_SELECTOR, '.exampleClass')

这里使用 . 符号来指定类名。

  1. 通过标签名定位元素：
1
element = driver.find_element(By.CSS_SELECTOR, 'div')

这里直接使用标签名。

  1. 通过属性值定位元素：
1
element = driver.find_element(By.CSS_SELECTOR, '[name="exampleName"]')

这里使用方括号来指定属性名和属性值。

  1. 通过层次关系定位元素：
1
element = driver.find_element(By.CSS_SELECTOR, 'div > p')

这里使用 > 符号来指定父子关系。

在开发者工具中，可以通过右键点击元素，然后选择 Copy -> Copy selector 来复制元素的 CSS Selector。

Selenium 定位复数元素

在 Selenium 中，可以使用 find_elements 方法结合 By.XX 来定位复数元素。

1
elements = driver.find_elements(By.XX, '')

find_elements 方法返回的是一个列表，列表中包含了所有匹配到的元素。

此时可以通过 for 循环来遍历列表中的元素。

1
2
3
elements = driver.find_elements(By.XX, '')
for element in elements:
    print(element.text)

element 是一个 WebElement 对象，有以下属性：

  • tag_name：返回元素的标签名。

  • text：返回元素的文本内容。

  • id：返回元素的 ID。

  • get_attribute(name)：返回元素的属性值。

WebElements 对象

在 Selenium 中，WebElement 是代表网页上的一个元素的接口。WebElement 接口提供了许多属性和方法，用于与网页上的元素进行交互。以下是一些常用的 WebElement 属性和方法：

属性（Properties）:

  1. id： 获取元素的 ID 属性。

    1
    element_id = element.id

  2. tag_name： 获取元素的标签名。

    1
    tag_name = element.tag_name

  3. text： 获取元素的文本内容。

    1
    text_content = element.text

  4. get_attribute(name)： 获取元素指定属性的值。

    1
    attribute_value = element.get_attribute('class')

方法（Methods）:

  1. click()： 模拟点击元素。

    1
    element.click()

  2. send_keys(value)： 向输入框或可编辑元素发送文本。

    1
    element.send_keys("Hello, Selenium!")

  3. clear()： 清空元素的内容，通常用于输入框。

    1
    element.clear()

  4. is_displayed()： 判断元素是否可见。

    1
    is_visible = element.is_displayed()

  5. is_enabled()： 判断元素是否可用（非灰化状态）。

    1
    is_enabled = element.is_enabled()

  6. is_selected()： 判断元素是否被选中，通常用于复选框和单选框。

    1
    is_selected = element.is_selected()

  7. find_element(by, value)： 在当前元素中查找符合条件的子元素。

    1
    child_element = element.find_element(By.XPATH, '//div[@class="example"]')

  8. find_elements(by, value)： 在当前元素中查找符合条件的所有子元素。

    1
    child_elements = element.find_elements(By.TAG_NAME, 'p')

这只是 WebElement 接口提供的一小部分属性和方法。具体的使用会根据实际情况和需要选择适当的属性和方法来操作网页元素。