Selenium 简明教程

Selenium Webdriver - Identify Multiple Elements

在本章中，我们将学习如何通过各种选项来识别多个元素。让我们从理解通过 ID 识别多个元素开始。

By id

不建议通过定位器 ID 识别多个元素，因为 id 属性的值对于一个元素是唯一的，并且适用于页面上的单个元素。

By Class name

一旦我们导航到一个网页，我们就必须与页面上可用的网络元素交互，例如单击链接/按钮、在编辑框中输入文本等等，才能完成我们的自动化测试用例。

为此，我们的首要任务是识别元素。我们可以对元素使用 class 属性进行识别，并利用方法 find_elements_by_class_name。这样，所有具有与属性 class 匹配值的所有元素都以列表形式返回。

如果不存在具有类属性匹配值的元素，则返回一个空列表。

识别多个 Classname 的 syntax 如下 −

driver.find_elements_by_class_name("value of class attribute")

让我们看看具有如下所示 class 属性的网络元素的 html 代码 −

toc chapters

上图中突出显示的 class 属性的值为 toc chapters。让我们尝试计算此类网络元素的数量。

Code Implementation

通过 Classname 识别多个元素的代码实现如下 −

from selenium import webdriver
driver = webdriver.Chrome(executable_path='../drivers/chromedriver')

#implicit wait time
driver.implicitly_wait(5)

#url launch
driver.get("https://www.tutorialspoint.com/about/about_careers.htm")

#identify elements with class attribute
l = driver.find_elements_by_class_name("chapters")

#count elements
s = len(l)
print('Count is:')
print(s)

#driver quit
driver.quit()
by class name

输出显示的消息为 - 进程退出代码 0，这意味着上面的 Python 代码执行成功。此外，具有类属性值 chapters（从 len 方法获得）的网络元素总数（2）将打印在控制台中。

By Tagname

一旦我们导航到一个网页，我们就必须与页面上可用的网络元素交互，例如单击链接/按钮、在编辑框中输入文本等等，才能完成我们的自动化测试用例。

为此，我们的首要任务是识别元素。我们可以对元素使用标签名进行识别，并利用方法 find_elements_by_tag_name。这样，所有具有与标签名匹配值的所有元素都以列表形式返回。

如果不存在具有与标签名匹配值的元素，则返回一个空列表。

通过 Tagname 标识多个元素的 syntax 如下所示 −

driver.find_elements_by_tag_name("value of tagname")

让我们看看 webelement 的 html 代码，如下所示 −

by tagname browser

上图中突出显示的 tagname 的值为 h4。让我们尝试计算具有 tagname 为 h4 的 webelement 的数量。

Code Implementation

通过 Tagname 标识多个元素的代码实现如下 −

from selenium import webdriver
driver = webdriver.Chrome(executable_path='../drivers/chromedriver')

#implicit wait time
driver.implicitly_wait(5)

#url launch
driver.get("https://www.tutorialspoint.com/index.htm")

#identify elements with tagname
l = driver.find_elements_by_tag_name("h4")

#count elements
s = len(l)
print('Count is:')
print(s)

#driver quit
driver.quit()
python codes

输出显示消息 - 退出代码为 0 的进程，表示上面的 Python 代码执行成功。此外，具有 tagname 为 h4 的 webelement 的总数（从 len 方法中获取） - 1 将打印在控制台中。

By Partial Link Text

一旦我们导航到一个网页，我们可能需要通过单击链接与 webelement 进行交互以完成我们的自动化测试用例。部分链接文本用于具有锚标记的元素。

为了达到这个目的，我们的首要任务是标识元素。我们可以为元素使用部分链接文本属性以对其进行标识并使用 find_elements_by_partial_link_text 方法。这样，所有具有给定部分链接文本匹配值的元素将以列表形式返回。

如果没有具有该部分链接文本匹配值的元素，则返回一个空列表。

通过部分链接文本标识多个元素的 syntax 如下所示 −

driver.find_elements_by_partial_link_text("value of partial link text")

让我们看看链接的 html 代码，如下所示 −

terms of use

上图中突出显示的链接 - 使用条款具有 tagname - a 和部分链接文本 - 条款。让我们在对其进行标识后尝试获取该文本。

Code Implementation

通过部分链接文本标识多个元素的代码实现如下 −

from selenium import webdriver
driver = webdriver.Chrome(executable_path='../drivers/chromedriver')

#implicit wait time
driver.implicitly_wait(5)

#url launch
driver.get("https://www.tutorialspoint.com/about/about_careers.htm")

#identify elements with partial link text
l = driver.find_elements_by_partial_link_text('Terms')

#count elements
s = len(l)

#iterate through list
for i in l:

#obtain text
   t = i.text
print('Text is: ' + t)

#driver quit
driver.quit()
printed in console

输出显示消息 - 退出代码为 0 的进程，表示上面的 Python 代码执行成功。此外，具有部分链接文本定位器（从文本方法中获取）标识的链接文本 - 使用条款将打印在控制台中。

By Link Text

一旦我们导航到一个网页，我们可能需要通过单击链接与 webelement 进行交互以完成我们的自动化测试用例。链接文本用于具有锚标记的元素。

为了达到这个目的，我们的首要任务是标识元素。我们可以为元素使用链接文本属性以对其进行标识并使用 find_elements_by_link_text 方法。这样，所有具有给定链接文本匹配值的元素将以列表形式返回。

如果没有具有该链接文本匹配值的元素，则返回一个空列表。

通过链接文本标识多个元素的 syntax 如下所示 −

driver.find_elements_by_link_text("value of link text")

让我们看看链接的 html 代码，如下所示 −

cookies policy

上图中突出显示的链接 - Cookie 政策具有 tagname - a 和链接文本 - Cookie 政策。让我们在对其进行标识后尝试获取该文本。

Code Implementation

通过链接文本标识多个元素的代码实现如下 −

from selenium import webdriver
driver = webdriver.Chrome(executable_path='../drivers/chromedriver')

#implicit wait time
driver.implicitly_wait(5)

#url launch
driver.get("https://www.tutorialspoint.com/about/about_careers.htm")

#identify elements with link text
l = driver.find_elements_by_link_text('Cookies Policy')

#count elements
s = len(l)

#iterate through list
for i in l:

#obtain text
   t = i.text
print('Text is: ' + t)

#driver quit
driver.quit()
by link text outputs

输出显示了信息 - 进程退出代码 0，表明上述 Python 代码已成功执行。此外，带有链接文本定位器（从 text 方法获取）的链接文本 - Cookies 政策将在控制台打印出来。

By Name

一旦我们导航到一个网页，我们就必须与页面上可用的网络元素交互，例如单击链接/按钮、在编辑框中输入文本等等，才能完成我们的自动化测试用例。

为此，我们的第一个任务是识别元素。我们可以使用元素的 name 属性进行识别并使用 find_elements_by_name 方法。使用此方法，具有匹配属性值 name 的元素将以列表的形式返回。

如果没有与 name 属性匹配值的元素，则将返回一个空列表。

用于按名称识别多个元素的 syntax 如下 −

driver.find_elements_by_name("value of name attribute")

让我们看看以下 web 元素的 html 代码 −

by name browser

上图中突出显示的编辑框具有值为 search 的 name 属性。让我们尝试识别该编辑框后向其中输入一些文本。

Code Implementation

通过名称识别多个元素的代码实现如下 −

from selenium import webdriver
driver = webdriver.Chrome(executable_path='../drivers/chromedriver')

#implicit wait time
driver.implicitly_wait(5)

#url launch
driver.get("https://www.tutorialspoint.com/index.htm")

#identify elements with name attribute
l = driver.find_elements_by_name('search')

#count elements
s = len(l)

#iterate through list
for i in l:

#obtain text
   t = i.send_keys('Selenium Python')
   v = i.get_attribute('value')
print('Value entered is: ' + v)

#driver quit
driver.quit()
selenium python gets printed

输出显示了信息 - 进程退出代码 0，表明上述 Python 代码已成功执行。此外，在编辑框中输入的值（从 get_attribute 方法获取） - Selenium Python 会在控制台打印出来。

By CSS Selector

一旦我们导航到一个网页，我们就必须与页面上可用的网络元素交互，例如单击链接/按钮、在编辑框中输入文本等等，才能完成我们的自动化测试用例。

为此，我们的第一个任务是识别元素。我们可以为它们创建 css 选择器并使用 find_elements_by_css_selector 方法。使用此方法，具有匹配给定 css 值的元素将以列表的形式返回。

如果没有与 css 匹配值的元素，则将返回一个空列表。

用于通过 CSS 选择器识别多个元素的 syntax 如下 −

driver.find_elements_by_css_selector("value of css")

Rules for CSS Expression

创建 css 表达式的规则在下面讨论 −

  1. 要使用 css 识别元素，表达式应为标签名[属性='值']。我们还可以专门使用 id 属性来创建 css 表达式。

  2. 使用 id，css 表达式的格式应为标签名#id。例如，input#txt [这里输入是标签名，txt 是 id 属性的值]。

  3. 使用 class，css 表达式的格式应为标签名.class。例如，input.cls-txt [这里输入是标签名，cls-txt 是 class 属性的值]。

  4. 如果父元素有 n 个子元素，并且我们想识别第 n 个子元素，那么 css 表达式应具有 nth-of –type(n)。

rules to create css expression

在上面的代码中，如果我们想识别 ul[Questions and Answers] 的第四个 li 子元素，则 css 表达式应为 ul.reading li:nth-of-type(4)。类似地，要识别最后一个子元素，css 表达式应为 ul.reading li:last-child。

对于值动态更改的属性，我们可以使用 ^= 来查找其属性值以特定文本开头的元素。例如，input[name^='qa'] [这里输入是标签名，name 属性的值以 qa 开头]。

对于值动态更改的属性，我们可以使用 $= 来查找其属性值以特定文本结尾的元素。例如，input[class$='txt'] 这里，输入是标签名，class 属性的值以 txt 结尾。

对于值动态变化的属性，我们可以使用 = to locate an element whose attribute value contains a specific sub-text. For example, input[name ='nam']。此处，input 是标签名称，而 name 属性的值包含子文本 nam。

让我们看看一个 web 元素的 html 代码：

rules of css expression

上面图像中突出显示的编辑框具有值的搜索 name 属性，css 表达式应为 input[name='search']。让我们在 identification 它后尝试在此编辑框中输入一些文本。

Code Implementation

通过 CSS 选择器识别多个元素的代码实现如下：

from selenium import webdriver
driver = webdriver.Chrome(executable_path='../drivers/chromedriver')

#implicit wait time
driver.implicitly_wait(5)

#url launch
driver.get("https://www.tutorialspoint.com/index.htm")

#identify elements with css
l = driver.find_elements_by_css_selector("input[name='search']")

#count elements
s = len(l)

#iterate through list
for i in l:

#obtain text
   t = i.send_keys('Tutorialspoint')
   v = i.get_attribute('value')
print('Value entered is: ' + v)

#driver quit
driver.quit()
python tutorialspoint

输出显示消息 - 进程退出代码为 0，表示上面的 Python 代码已成功执行。此外，在编辑框内输入的值（从 get_attribute 方法获取） - Tutorialspoint 会打印在控制台中。

By Xpath

一旦我们导航到一个网页，我们就必须与页面上可用的网络元素交互，例如单击链接/按钮、在编辑框中输入文本等等，才能完成我们的自动化测试用例。

为此，我们的第一个任务是识别元素。我们可以为它们的 identification 创建一个 xpath，并使用 find_elements_by_xpath 方法。这样，具有给定 xpath 匹配值 的元素将以列表的形式返回。

如果没有元素具有与 xpath 匹配的值，则将返回一个空列表。

通过 Xpath identification 多个元素的 syntax 如下：

driver.find_elements_by_xpath("value of xpath")

Rules for Xpath Expression

创建 xpath 表达式的规则如下所述：

  1. 要使用 xpath 识别元素，表达式应为 //tagname[@attribute='value']。xpath 可以有两种类型 - 相对和绝对。绝对 xpath 以 / 符号开头，从根节点开始到我们想要 identification 的元素。

例如，

/html/body/div[1]/div/div[1]/a

  1. 相对 xpath 以 // 符号开头，不从根节点开始。

例如，

//img[@alt='tutorialspoint']

让我们从根部开始看高亮链接 - 主页的 html 代码。

home starting

元素主页的绝对 xpath 如下：

/html/body/div[1]/div/div[1]/a.
absolute xpath

元素主页的相对 xpath 可以如下：

//a[@title='TutorialsPoint - Home'].
relative xpath

Functions

还有一些函数可以帮助构建相对 xpath 表达式：

text()

它用于借助页面上的可见文本来 identification 元素。xpath 表达式如下：

//*[text()='Home'].
text

starts-with

它用于 identification 其属性值以特定文本开头的元素。此函数通常用于在每个页面加载时其值都会发生变化的属性。

让我们查看元素 Q/A 的 html −

attribute value

xpath 表达式应如下 −

//a[starts-with(@title, 'Questions &')].
console output

contains()

它标识一个其属性值包含子文本的元素。此函数通常用于在每次页面加载时都会更改其值的属性。

xpath 表达式如下 −

//a[contains(@title, 'Questions & Answers')].
contains qa

让我们看看一个 web 元素的 html 代码：

html code of webelement

上图中高亮的编辑框有一个名为搜索的属性，xpath 表达式应为 //input[@name='search']。让我们在识别出此编辑框后尝试在其中输入一些文本。

Code Implementation

通过 Xpath 识别多个元素的代码实现如下 −

from selenium import webdriver
driver = webdriver.Chrome(executable_path='../drivers/chromedriver')

#implicit wait time
driver.implicitly_wait(5)

#url launch
driver.get("https://www.tutorialspoint.com/index.htm")

#identify elements with xpath
l = driver.find_elements_by_xpath("//input[@name='search']")

#count elements
s = len(l)

#iterate through list
for i in l:

#obtain text
   t = i.send_keys('Tutorialspoint - Selenium')
   v = i.get_attribute('value')
print('Value entered is: ' + v)

#driver quit
driver.quit()
selenium gets printed

输出显示消息 - 进程退出代码 0，表示上述 Python 代码已成功执行。此外，在编辑框中输入的值（从 get_attribute 方法获取） - Tutorialspoint - Selenium 将打印在控制台中。