【selenium学习笔记】webdriver进行页面元素定位

原创 2015年07月07日 14:43:19

进行Web页面自动化测试,对页面上的元素进行定位和操作是核心。而操作又是以定位为前提的,因此,对页面元素的定位是进行自动化测试的基础。

页面上的元素就像人一样,有各种属性,比如元素名字,元素id,元素属性(class属性,name属性)等等。webdriver就是利用元素的这些属性来进行定位的。

可以用于定位的常用的元素属性:

  • id
  • name
  • class name
  • tag name
  • link text
  • partial link text
  • xpath
  • css selector
对应于webdriver中的定位方法分别是:
  • driver.find_element_by_name()——最常用,简单
  • driver.find_element_by_id()——最常用,简单
  • driver.find_element_by_class_name()
  • driver.find_element_by_tag_name()——最不靠谱
  • driver.find_element_by_link_text()——定位文字连接好用
  • driver.find_element_by_partial_link_text()——定位文字连接好用
  • driver.find_element_by_xpath()——最灵活,万能
  • driver.find_element_by_css_selector()
上面是定位一个元素的方法,相应的webdriver也有定位一组元素的方法:
  • driver.find_elements_by_name()
  • driver.find_elements_by_id()
  • driver.find_elements_by_class_name()
  • driver.find_elements_by_tag_name()
  • driver.find_elements_by_link_text()
  • driver.find_elements_by_partial_link_text()
  • driver.find_elements_by_xpath()
  • driver.find_elements_by_css_selector()
那么问题来了?怎么查看元素的name,id,class,tag,text,xpath,css选择器呢?可以借助firefox浏览器的firebug插件(需要手动安装)中firepath工具或者chrome的开发者工具(chrome自带)。
  • Friebug
打开firefox 浏览器的firebug 插件,点击插件左上角的鼠标箭头,再点击页面上的元素,firebug插件的HTML 标签页将看到页面代码,鼠标移动到元素的标签上点击一下。例如我们点击百度首页的“百度一下”按钮:

从FirePath中可以看到该元素的id,tag,class等属性。

  • Chrome开发者工具(F12)
打开Chrome浏览器,按下键盘的F12,即可以打开开发者工具。从开发者工具中可以得到和FirePath相同的结果:


那么问题又来了,这么多属性都可以用来定位,那么我们选择哪种呢?其实,定位元素的方法没有好坏之分,不同的场景有不同的适用方法,只要定位的唯一的一个元素的方法都是可以使用的。
  • id 和name 定位
这是简单的高效的方法。
比如定位百度首页文本框的方法,我们可以使用id来定位(该元素提供的id属性,可以唯一定位到它):
driver.find_element_by_id('kw')
定位百度首页右上角的“设置”链接,我们可以使用name来定位(该元素提供的name属性,可以唯一定位到它):
driver.find_element_by_name('tj_trnews')
  • class name和tag name定位
不是所有的前端开发人员都喜欢为每一个元素添加id 和name 两个属性,但除此之外你一定发现了一个元素不单单只有id 和name,它还有class 属性;而且每个元素都会有tag标签。
还是定位百度首页的文本框,除了用id方法定位之外,我们还可以用class name来定位(该元素提供的class属性,也可以唯一定位到它)。
driver.find_element_by_class_name("s_ipt")
tag name 定位应该是所有定位方式中最不靠谱的一种了,因为在一个页面中具有相同tag name 的元素极其容易出现,很少具有唯一性。不用学习它了。
  • link text 与partial link text 定位
有时候需要操作的元素是一个文字链接,那么我们可以通过link text 或partial link text 进行元素定位。
比如,定位百度首页右上角的“新闻”,“hao123”,。。。。等等这些文字连接。就可以使用link text和partail link text定位方式。可以先使用FireBug看下网页源码:


通过linx text定位:
find_element_by_link_text("新闻")
find_element_by_link_text("贴吧")
通过partail link text定位:
find_element_by_link_text("新")
find_element_by_link_text("贴")
  • XPath 定位
XPath是一种文档定位语言。因为HTML可以看做是XML的一种实现,所以selenium用户可使用这种强大的语言在web应用中定位。
绝对路径方法:
从根元素写起,当元素层级很深的时候,路径写的会很长,阅读性不好,也很难维护。不建议使绝对路径这样的方法。
相对路径方法:
通过Firebug很容易得到相对路径的xpath,打开Firebug插件,在页面上的搜索文本框,就可以显示出xpath了:
<pre name="code" class="python">driver.find_element_by_xpath("//*[@id='kw']").click()

上面的写法可以理解为,通过xpath寻找,任意(*代表)id属性为’kw‘的元素。当然我们也可以把*替换成input,即:
driver.find_element_by_xpath("//input[@id='kw']").click()
这种写法可以理解为,通过xpath寻找,任意id属性为’kw‘的input元素。
有的时候,需要根据上级目录的属性来定位当前元素:
find_element_by_xpath("//span[@id=’input-container’]/input") #通过上一级目录的id 属性定位
find_element_by_xpath("//div[@id=’hd’]/form/span/input") #通过上三级目录的id 属性定位
find_element_by_xpath("//div[@name=’q’]/form/span/input")#通过上三级目录的name 属性定位
  • CSS定位
这种定位方法是比较难理解的。TBD,当前工作中也没有遇到,必须使用这种方式才能定位到元素的情况。

  • 关于自动化的定位问题
自动化测试的元素定位一直是困扰自动化测试新手的一个障碍,因为我们在自动化实施过程中会碰到各式各样的对象元素。虽然XPath 和CSS 可以定位到复杂且比较难定位的元素,但相比较用id 和name 来说增加了维护成本和学习成本,相比较来说id/name 的定位方式更直观和可维护,有新的成员加入的自动化时也增加了人员的学习成本。所以,测试人员在实施自动化测试时一定要做好沟通,规范前端开发人员对元素添加id/name 属性,或者自己有修改HTML 代码的权限。

版权声明:本文为博主原创文章,欢迎转赞,但请保留作者署名。

相关文章推荐

selenium WebDriver定位元素学习总结

定位元素先要掌握基本的HTML语法: http://blog.csdn.net/jojoy_tester/article/details/53222425 http://blog.csdn.net/...

Java+Selenium3方法篇6-findElement之By XPath

前面一篇,介绍了查找元素的方法By id,这篇来介绍By XPath。在如何写XPath表达式之前,你需要对XPath有一个基本了解,关于XPath入门,你可以点击这里。 下面,通过百度首页,演示如...

在Selenium WebDriver中使用By.Xpath快速定位页面元素

以登录页面密码框定位为例,讲解如何在selenium webdriver中通过by.xpath定位页面元素,快速获取元素位置并完成操作。   问题引入:   用Selenium IDE录制后的脚本如下...

[python爬虫] Selenium常见元素定位方法和操作的学习介绍

这篇文章主要Selenium+Python自动测试或爬虫中的常见定位方法、鼠标操作、键盘操作介绍,希望该篇基础性文章对你有所帮助,如果有错误或不足之处,请海涵~ 一.定位元素方法 二.操作元素方法 ...

selenium - python 总结

# coding:utf-8 from selenium import webdriver from selenium.webdriver.common.keys import Keys ...

在Selenium WebDriver中使用By.Xpath快速定位页面元素

转载: http://www.51testing.com/html/38/113838-849231.html 以登录页面密码框定位为例,讲解如何在selenium webdr...
  • lcm_up
  • lcm_up
  • 2013年12月15日 15:52
  • 3823

selenium_webdriver(python)元素定位详解

webdriver 提供了一系列的对象定位方法,常用的有以下几种  · id  · name  · class name  · link text  · partial link text ...

Selenium+Webdriver 常用的元素定位方式

Selenium+Webdriver元素定位

selenium webdriver 学习总结-元素定位

webdriver提供了丰富的API,有多种定位策略:id,name,css选择器,xpath等,其中css选择器定位元素效率相比xpath要高些,使用id,name属性定位元素是最可靠,效率最高的一...

Selenium Webdriver元素定位的八种常用方法

在使用selenium webdriver进行元素定位时,通常使用findElement或findElements方法结合By类返回的元素句柄来定位元素。其中By类的常用定位方式共八种,现分别介绍如下...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:【selenium学习笔记】webdriver进行页面元素定位
举报原因:
原因补充:

(最多只允许输入30个字)