selenium+python自动化测试之页面元素定位

上一篇博客selenium+python自动化测试(二)–使用webdriver操作浏览器讲解了使用webdriver操作浏览器的各种方法,可以实现对浏览器进行操作了,接下来就是对浏览器页面中的元素进行操作,操作页面元素,首先要找到操作的元素,对元素进行定位

查看页面源码

要定位页面元素,需要找到页面的源码,IE浏览器中,打开页面后,在页面上点击鼠标右键,会有“查看源代码”的选项,点击后就会进入页面源码页面,在这里就可以找到页面的所有元素

使用Chrome浏览器打开页面后,在浏览器的地址栏右侧有一个图标,点击这个图标后,会出现许多菜单项,选择更多工具里的开发者工具,就会出现页面的源码,不同版本的浏览器菜单选项可能不同,但是都会在开发者工具里找到页面的源码

Firefox浏览器打开页面后,在右键菜单里也可以找到“查看页面源代码”的选项。在Firefox中,可以使用浏览器自带的插件查看定位元素,在Firefox的附加组件里搜索firebug进行下载,安装firebug组件后会在浏览器的工具栏中多出一个小虫子的图标,点击这个图标就可以打开组件查看页面源码,打开后如下图所示

以百度首页搜索页面为例,看一下webdriver定位元素的八种方式

使用id定位

在页面源码中找到搜索输入框的元素定义

<input id="kw" name="wd" class="s_ipt" value="" maxlength="255" autocomplete="off">

可以看到输入框有一个有一个id的属性,调用find_element_by_id()根据id属性来找到元素,参数为属性的值

input_search = driver.find_element_by_id("kw")

使用name定位

使用find_element_by_name()根据name属性找到元素,参数为name属性的值

搜索框有一个name=”wd”的属性,使用name查找搜索输入框元素

input_search = driver.find_element_by_name("wd")

使用className定位

使用find_element_by_class_name()根据className属性找到元素,参数为className属性的值

搜索框有一个class=”s_ipt”的属性,使用className查找元素

input_search = driver.find_element_by_class_name("s_ipt")

使用tagName定位

使用find_element_by_tag_name()根据tagName属性找到元素,参数为元素标签的名称

每个页面的元素都有一个tag,搜索框的标签为input,有时候一个页面里有许多相同的标签,所以用这种方法找到的元素一般都不准确,除非这个元素使用的标签在这个页面里是唯一的。一般不会使用这种方式来定位元素

input_search = driver.find_element_by_class_name("input")

使用link_text定位

页面上都会有一些文本链接,点击链接后会打开一个新的页面,这些可以点击的链接可以使用find_element_by_link_text来定位,百度首页上方有如下几个元素

例如要定位“新闻”,找到元素的代码,有一个href的属性,这是点击后打开的页面

<a href="http://news.baidu.com" rel="external nofollow" name="tj_trnews" class="mnav">新闻</a>

使用link_text查找元素,参数为元素的文本信息

news = driver.find_element_by_link_text("新闻")

使用partial_link_text定位

这种方式类似于link_text的定位方式,如果一个元素的文本过长,不需要使用文本的所有信息,可以使用其中的部分文本就可以定位

使用partial_link_text查找百度首页的“新闻”元素,参数为文本信息,可以使用全部的文本,也可以使用部分文本

news = driver.find_element_by_link_text("新闻") //使用全部文本
news = driver.find_element_by_link_text("新") //使用部分文本

使用css selector定位

使用css属性定位元素有多种方法,可以使用元素的id、name、className,也可以使用元素的其他属性,如果一个元素没有上述的几种属性或者定位不到时,可以使用css来定位

还是使用百度搜索框的实例来说明css定位的用法

<input id="kw" name="wd" class="s_ipt" value="" maxlength="255" autocomplete="off">
  • css使用元素的id定位

css属性使用id定位时,使用#号表示元素的id

input_search = driver.find_element_by_css_selector("#kw") //使用元素的id定位
  • css使用元素的class定位

css属性使用class定位时,使用.号表示元素的class

input_search = driver.find_element_by_css_selector(".s_ipt") //使用元素的class定位
  • css使用元素的tag定位

css属性使用tagName定位时,直接使用元素的标签

input_search = driver.find_element_by_css_selector("input") //使用元素的tagName定位
  • css使用元素的其他属性

除了上述3种属性,css属性可以使用元素的其他属性定位,格式如下

input_search = driver.find_element_by_css_selector("[maxlength='255']") //使用元素的maxlength属性定位
input_search = driver.find_element_by_css_selector("[autocomplete='off']") //使用元素的autocomplete属性定位

可以在参数中加入元素的标签名称

input_search = driver.find_element_by_css_selector("input#kw") //使用元素的id定位
input_search = driver.find_element_by_css_selector("input.s_ipt") //使用元素的class定位driver.find_element_by_css_selector("input[maxlength='255']") //使用元素的maxlength属性定位
input_search = driver.find_element_by_css_selector("input[autocomplete='off']") //使用元素的autocomplete属性定位
  • css的层级定位

当一个元素使用自身的属性不容易定位时,可以通过它的父元素来找到它,如果父元素也不好定位,可以再通过上元素来定位,以此类推,一直找到容易定位的父元素为止,通过层级定位到需要查找的元素

通过Firefox的firebug组件查看百度首页的源码

通过层级来定位搜索框

input_search = driver.find_element_by_css_selector("form#form>span:nth-child(1)>input")
input_search = driver.find_element_by_css_selector("form.fm>span:nth-child(1)>input")

搜索框的父元素为span标签,span的父元素为form,form有id和class属性,可以通过这两个属性来定位,找到form元素后,form下有多个span标签,所以要使用span:nth-child(1),表示form下的第一个span标签,这种用法很容易理解,表示第几个孩子,最后是span下的input标签,span下只有一个input,所以就可以定位到搜索框

  • css逻辑运算

用一个属性来定位元素时,如果有其他元素的属性和此元素重复,可以组合多个属性来功共同定位

组合多个属性定位元素定位百度搜索框

input_search = driver.find_element_by_css_selector("input[id='kw'][name='wd']")

在元素内定义的属性,都可以使用css来定位,使用其他几种方式无法定位到元素时,可以使用css,够强大!

使用xpath定位

XPath是一种在XML文档中定位元素的语言。因为HTML可以看做XML的一种实现,所以selenium用户可是使用这种强大语言在web应用中定位元素。xpath也可以通过元素的各种属性定位到元素

使用元素属性定位

input_search = driver.find_element_by_xpath("//*[@id='kw']") //通过元素id查找元素
input_search = driver.find_element_by_xpath("//*[@name='wd']") //通过元素name查找元素
input_search = driver.find_element_by_xpath("//*[@class='s_ipt']") //通过元素class查找元素
input_search = driver.find_element_by_xpath("//*[@maxlength='255']") //通过其他属性查找元素
input_search = driver.find_element_by_xpath("//*[@autocomplete='off']") //通过其他属性查找元素

前面的*号表示查找所有的标签元素,可以替换为标签名称,更准确的定位元素

input_search = driver.find_element_by_xpath("//input[@id='kw']") //通过元素id查找元素
input_search = driver.find_element_by_xpath("//input[@name='wd']") //通过元素name查找元素
input_search = driver.find_element_by_xpath("//input[@class='s_ipt']") //通过元素class查找元素
input_search = driver.find_element_by_xpath("//input[@maxlength='255']") //通过其他属性查找元素
input_search = driver.find_element_by_xpath("//input[@autocomplete='off']") //通过其他属性查找元素
  • xpath层级定位

xpath也可以通过层级来定位,定位方式

input_search = driver.find_element_by_xpath("//input[@id='form']//span[1]//input")
driver.find_element_by_xpath("//input[@class='fm']//span[1]//input")

查找效果和通过css的层级定位是相同的,意思是form元素下面的第一个span元素的input标签子元素

  • xpath

xpath的逻辑元素通过and运算符来组合元素属性

input_search = driver.find_element_by_xpath("//input[@id='kw' and name='wd']")
  • 属性匹配

xpath中还有一种更强大的定位方式,通过模糊匹配元素的属性

news = driver.find_element_by_xpath("//a[contains(text(), '新闻')]") //查找text中包含"新闻"的元素
input_search = driver.find_element_by_xpath("//input[contains(@id, 'kw']") //查找id中包含"kw"的元素
input_search = driver.find_element_by_xpath("//input[starts-with(@id, 'k']") //查找id以"k"开头的元素
input_search = driver.find_element_by_xpath("//input[ends-with(@id, 'w']") //查找id以"w"结尾的元素
input_search = driver.find_element_by_xpath("//input[matchs(@id, 'k*']") //利用正则表达式查找元素

上面介绍了查找页面元素的八种方法,通过这些方式找到的都是单个元素,如果需要批量查找元素,还有和上面方式对应的八种复数形式

find_elements_by_id
find_elements_by_name
find_elements_by_class_name
find_elements_by_tag_name
find_elements_by_link_text
find_elements_by_partial_link_text
find_elements_by_css_selector
find_elements_by_xpath

这8种方法查找到的是一组元素,返回的是list,可以通过索引来操作元素

例如页面上的复选框和单选框,或者页面上有多个属相相同的输入框,这些属性相同的一组元素,可以批量获取,然后过滤出需要操作的元素,选择其中的一个或者多个进行操作

通过百度首页搜索“selenium”关键字,会出现许多搜索结果,这些搜索结果具有相同的属性,不同的是属性的值不同,定位这些元素时,可以使用批量定位的方法

看下面的代码

这是搜索selenium关键字后的页面结果,每一个搜索结果都是可点击的链接,定位这些元素的方法:

search_results = driver.find_elements_by_css_selector("h.t>a")
search_results[3].click() //通过索引点击第4条搜索结果

第二个例子

<html>
 <head></head>
 <body>
 <h3>checkbox</h3>
 <div class="well">
  <form class="form-horizontal">
  <div class="control-group">
   <label class="control-label" for="c1">checkbox1</label>
   <div class="controls">
   <input type="checkbox" id="c1" />
   </div>
  </div>
  <div class="control-group">
   <label class="control-label" for="c2">checkbox2</label>
   <div class="controls">
   <input type="checkbox" id="c2" />
   </div>
  </div>
  <div class="control-group">
   <label class="control-label" for="c3">checkbox3</label>
   <div class="controls">
   <input type="checkbox" id="c3" />
   </div>
  </div>
  </form>
 </div>
 </body>
</html>

这个页面上有3个复选框,打开后如下图所示:

操作复选框

//查找所有的复选框并点击
checkboxs = driver.find_element_by_xpath('input[@type="checkbox"]')
for checkbox in checkboxs:
 checkbox.click()
//点击最后一个复选框
checkboxs[2].click()

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

时间: 2019-01-23

基于selenium 获取新页面元素失败的解决方法

当我们使用selenium 实现模拟登陆时,获取到登陆按钮元素后,直接调用它的click()方法就能实现登陆跳转,并且此时的webDriver 也是指向 当前页面,这个是没问题的,不过需要注意的是因为页面加载速度一般小于程序运行速度,所以在获取登陆后页面的元素之前,可以用WebDriverWait的util方法解决,也可以直接通过Thread.sleep()让程序睡眠一会(不推荐). 但是博主要说的重点是如果我们是通过点击普通超链接进入到新页面,那么通过上面的方法是获取不到新页面元素的,因为此时

python+selenium 定位到元素,无法点击的解决方法

报错 selenium.common.exceptions.WebDriverException: Message: Element is not clickable at point (234.75, 22). Other element would receive the click: <img class="logo" src="/public/desktop/common/img/game_logo.png"> 需要点击的按钮页面显示不了,需要下

Python 中的Selenium异常处理实例代码

自动化测试执行过程中,难免会有错误/异常出现,比如测试脚本没有发现对应元素,则会立刻抛出NoSuchElementException异常.这时不要怕,肯定是测试脚本或者测试环境哪里出错了!那如何处理才是关键?因为一般只是局部有问题,为了让脚本继续执行,so我们可以用try...except...raise捕获异常.该捕获异常后可以打印出相应的异常原因,这样以便于分析异常原因. 下面将举例说明,当异常抛出后将信息打印在控制台,同时截取当前浏览器窗口,作为后续bug的依据给相应开发人员更好下定位问题

python+selenium实现登录账户后自动点击的示例

公司在codereview的时候限制了看代码的时间,实际上不少代码属于框架自动生成,并不需要花费太多时间看,为了达标,需要刷点时间(鼠标点击网页固定区域).我想到可以利用自动化测试的手段完成这种无效的体力劳动. 首先,明确一下需求: 自动打开网页 登陆账号 每隔一定时间点击一下固定区域 我想到的方案有两个,sikuli或者python+selenium.sikuli的优点是逻辑操作简单直接,使用图片作为标示,缺点是需要窗口固定,并且无法后台运行.selenium稍复杂一定,但是运行速度快,窗口可

Selenium定位元素操作示例

本文实例讲述了Selenium定位元素操作.分享给大家供大家参考,具体如下: Selenium是一个用于Web应用程序测试的工具.Selenium测试直接运行在浏览器中,就像真正的用户在操作一样.支持的浏览器包括IE(7, 8, 9, 10, 11),Mozilla Firefox,Safari,Google Chrome,Opera等.这个工具的主要功能包括:测试与浏览器的兼容性--测试你的应用程序看是否能够很好得工作在不同浏览器和操作系统之上.测试系统功能--创建回归测试检验软件功能和用户需

Python selenium 三种等待方式详解(必会)

很多人在群里问,这个下拉框定位不到.那个弹出框定位不到-各种定位不到,其实大多数情况下就是两种问题:1 有frame,2 没有加等待.殊不知,你的代码运行速度是什么量级的,而浏览器加载渲染速度又是什么量级的,就好比闪电侠和凹凸曼约好去打怪兽,然后闪电侠打完回来之后问凹凸曼你为啥还在穿鞋没出门?凹凸曼分分中内心一万只羊驼飞过,欺负哥速度慢,哥不跟你玩了,抛个异常撂挑子了. 那么怎么才能照顾到凹凸曼缓慢的加载速度呢?只有一个办法,那就是等喽.说到等,又有三种等法,且听博主一一道来: 1. 强制等待

Pycharm无法使用已经安装Selenium的解决方法

电脑C盘安装python27的时候也安装了selenium,但是最近刚刚使用工具Pycharm,新建工程后,然后建立.py文件后,使用语句:from selenium.webdriver.support.wait import WebDriverWait 接着提示没有selenium这个模块,后来发现,在Pycharm上运行脚本时,使用的是其自带的虚拟环境,而不是电脑已经装配好的python27的环境: 该环境本身缺少很多外部库,尝试在此环境下装selenium,但是失败了: 所以,接下来只能P

Selenium元素的常用操作方法分析

本文实例讲述了Selenium元素的常用操作方法.分享给大家供大家参考,具体如下: Selenium是一个用于Web应用程序测试的工具.Selenium测试直接运行在浏览器中,就像真正的用户在操作一样.支持的浏览器包括IE(7, 8, 9, 10, 11),Mozilla Firefox,Safari,Google Chrome,Opera等.这个工具的主要功能包括:测试与浏览器的兼容性--测试你的应用程序看是否能够很好得工作在不同浏览器和操作系统之上.测试系统功能--创建回归测试检验软件功能和

Selenium鼠标与键盘事件常用操作方法示例

本文实例讲述了Selenium鼠标与键盘事件常用操作方法.分享给大家供大家参考,具体如下: Selenium是一个用于Web应用程序测试的工具.Selenium测试直接运行在浏览器中,就像真正的用户在操作一样.支持的浏览器包括IE(7, 8, 9, 10, 11),Mozilla Firefox,Safari,Google Chrome,Opera等.这个工具的主要功能包括:测试与浏览器的兼容性--测试你的应用程序看是否能够很好得工作在不同浏览器和操作系统之上.测试系统功能--创建回归测试检验软

java selenium元素定位大全

页面元素定位是自动化中最重要的事情, selenium Webdriver 提供了很多种元素定位的方法.  测试人员应该熟练掌握各种定位方法. 使用最简单,最稳定的定位方法. 阅读目录 自动化测试步骤 定位方法大全 如何定位 通过ID查找元素: By.id() 通过Name查找元素:By.name() 通过TagName查找元素: By.tagName() 通过ClassName 查找元素 By.className 通过LinkText查找元素 By.linkText(); 通过PartialL

python数据类型_元组、字典常用操作方法(介绍)

元组 Python的元组与列表类似,不同之处在于元组的元素不能修改. 元组使用小括号,列表使用方括号. 元组创建很简单,只需要在括号中添加元素,并使用逗号隔开即可. tp=(1,2,3,'a','b') a = 'hello world' #这样定义是str类型 b = ('hello world') #定义元组时,如果只有一个元素,那么b的类型就是str c = ('hello world',) print(type(c)) 元组只有count和index方法,如下: tp = ('127.0

js数组常用操作方法小结(增加,删除,合并,分割等)

本文实例总结了js数组常用操作方法.分享给大家供大家参考,具体如下: var arr = [1, 2, 3, 4, 5]; //删除并返回数组中第一个元素 var theFirst = arr.shift(); alert(theFirst);//返回1 number alert(arr);//2,3,4,5 object //删除并返回数组中最后一个元素 var theLast = arr.pop(); alert(theLast);//返回5 number alert(arr);//2,3,

python中字典dict常用操作方法实例总结

本文实例总结了python中字典dict常用操作方法.分享给大家供大家参考.具体如下: 下面的python代码展示python中字典的常用操作,字典在python开发中有着举足轻重的地位,掌握字典操作相当重要 #创建一空字典 x = {} #创建包含三个项目的字典 x = {"one":1, "two":2, "three":3} #访问其中的一个元素 x['two'] #返回字典中的所有键列表 x.keys() #返回字典中的所有值列表 x.v

python字典的常用操作方法小结

Python字典是另一种可变容器模型(无序),且可存储任意类型对象,如字符串.数字.元组等其他容器模型.本文章主要介绍Python中字典(Dict)的详解操作方法,包含创建.访问.删除.其它操作等,需要的朋友可以参考下. 字典由键和对应值成对组成.字典也被称作关联数组或哈希表.基本语法如下: 1.创建字典 >>> dict = {'ob1':'computer', 'ob2':'mouse', 'ob3':'printer'} 技巧: 字典中包含列表:dict={'yangrong':[

Selenium元素定位的30种方式(史上最全)

Selenium对网页的控制是基于各种前端元素的,在使用过程中,对于元素的定位是基础,只有准去抓取到对应元素才能进行后续的自动化控制,我在这里将对各种元素定位方式进行总结归纳一下. 这里将统一使用百度首页(www.baidu.com)进行示例,f12可以查看具体前端代码. WebDriver8种基本元素定位方式 find_element_by_id() 采用id属性进行定位.例如在百度页面中输入关键字 Selenium 进行搜索.百度部分关键源码如下: <span class="bg s_

原生JavaScript来实现对dom元素class的操作方法(推荐)

jQuery操作class的方式非常强大 写了一个利用原生js来实现对dom元素class的操作方法 1.addClass:为指定的dom元素添加样式 2.removeClass:删除指定dom元素的样式 3.toggleClass:如果存在(不存在),就删除(添加)一个样式 4.hasClass:判断样式是否存在 下面为一toggleClass的测试例子 [html] view plain copy <style type="text/css"> div.testClas

JavaScript表格常用操作方法汇总

本文实例汇总了JavaScript表格常用操作方法.分享给大家供大家参考.具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <