Selenium对网页的控制是基于各种前端元素的,在使用过程中,对于元素的定位是基础,只有准去抓取到对应元素才能进行后续的自动化控制,我在这里将对各种元素定位方式进行总结归纳一下。

这里将统一使用百度首页(www.baidu.com)进行示例,f12可以查看具体前端代码。
WebDriver8种基本元素定位方式
find_element_by_id()

采用id属性进行定位。例如在百度页面中输入关键字 Selenium 进行搜索。百度部分关键源码如下:
<span class="bg s_ipt_wr quickdelete-wrap">
    <span class="soutu-btn"></span>
    <input id="kw" class="s_ipt" autocomplete="off" maxlength="255" value="" name="wd">
    <a id="quickdelete" class="quickdelete" href="javascript:;" title="清空" style="top: 0px; right: 0px; display: none;"></a>
</span>
<span class="bg s_btn_wr">
    <input id="su" class="bg s_btn" type="submit" value="百度一下">
</span>
可以看到输入框和百度一下的按钮都有id,那么定位代码如下:

#coding=utf-8
from selenium import webdriver
import time
from selenium.webdriver.common.by import By

driver = webdriver.Chrome()
driver.implicitly_wait(10)
driver.get("http://www.baidu.com")

driver.find_element_by_id("kw").send_keys("Selenium")
driver.find_element_by_id("su").click()

time.sleep(2)
driver.quit()
find_element_by_name() 
find_element_by_class_name() 
根据name元素和class的名字进行定位,这两种定位方式和id定位相似,在前端代码中,id、name和class一般都至少会有其中的一种,比如百度的搜索框具有name属性,我们可以用name定位搜索款,class定位百度一下的按钮:
driver.find_element_by_name("wd").send_keys("Python")
driver.find_element_by_class_name("s_btn").click()
find_element_by_xpath() 
xpath是XML路径语言,它可以用来确定xml文档中的元素位置,通过元素的路径来完成对元素的查找。HTML就是XML的一种实现方式,所以xpath是一种非常强大的定位方式。
xpath也分几种不同类型的定位方法。

一种是绝对路径定位。这种定位方式是利用html标签名的层级关系来定位元素的绝对路径,一般从<html>标签开始依次往下进行查找。
如百度搜索框的绝对路径xpath定位可以是这样的:
find_element_by_xpath("/html/body/div[1]/div[1]/div/div[1]/div/form/span[1]/input")

还有一种是利用元素属性来进行xpath定位,搜索框还可以利用id和name属性去定位:

find_element_by_xpath("//input[@id='kw']")

find_element_by_xpath("//*[@name='wd']")

其中的标签名input也可以用*来代替,而且只要是在该标签内,任意属性都可以,比如搜索框的maxlength属性:

find_element_by_xpath("//input[@maxlength='255']")

有的时候我们会发现绝对路径定位路径太长,而且光凭路径完全不可以猜测到其指向的具体页面元素,如果只有单纯的元素属性不一定可以每次查找的元素都可以又唯一的属性去方便定位,这个时候我们可以将这两种定位方式结合起来使用。

比如查找搜索框的时候发现其上级元素form又唯一的id方便定位,就可以先查找到form元素然后依次往下写路径:

find_element_by_xpath("//form[@id='form']/span/input")

这种定位方式的使用过程中,如果元素的单个属性无法确定其唯一性,可以用and连接多个属性去确定。

find_element_by_css_selector()
CSS属性定位可以比较灵活地选择控件的任意属性,定位方式也会比xpath快。
同样是那个百度搜索的例子,可以试一下:

driver.find_element_by_css_selector(".s_ipt").send_keys("selenium")
driver.find_element_by_css_selector("#su").click()
如果有css基础的话就应该可以看懂,一般class是用.标记,id是用#标记,标签名直接写具体标签名就好了。

css定位里面也可以通过属性或者组合方式定位:

driver.find_element_by_css_selector("input[autocomplete='off']").send_keys("Python")
driver.find_element_by_css_selector("span.bg.s_btn_wr>input#su").click()
具体说一下百度一下那个按钮的组合定位方式,这样写的定位顺序是这样的,先定位到一个class名为bg s_btn_wr的span标签,在这个标签下面有一个id为su的input标签,这样就定位到了。

值得注意的是,在css里面下级标签元素用>连接,如果class里面有空格,空格用.进行连接。

find_element_by_tag_name ()
通过标签名去定位的方式一般是这样的:find_element_by_tag_name("input")
可见仅仅通过标签名去定位时,一般一种标签在一个页面里面会出现不止一次甚至大量出现,这种定位方式的作用不是很大,所以用的也就比较少。

find_element_by_link_text()
find_element_by_partial_link_text()
这两种定位方式是专门用于定位超链接的,也就是对应html页面中的<a>标签,括号里传的值就是a标签中的超链接文字,两者的区别在于一个是完整的超链接文字,一个是可以只写部分超链接文字。
比如点击百度首页中右上角的新闻超链接,可以这样去定位:

driver.find_element_by_link_text("新闻").click()
driver.find_element_by_partial_link_text("闻").click()

By定位
通过对上面8种基本元素定位方式的学习,在使用过程种可以根据实际的情况去选择对应的的定位方式,我们可以用By来设置定位策略,具体语法如下:
find_element(By.ID,"kw")
find_element(By.NAME,"wd")
find_element(By.CLASS_NAME,"s_ipt")
find_element(By.TAG_NAME,"input")
find_element(By.LINK_TEXT,u"新闻")
find_element(By.PARTIAL_LINK_TEXT,u"新")
find_element(By.XPATH,"//*[@class='bg s_btn']")
find_element(By.CSS_SELECTOR,"span.bg s_btn_wr>input#su")

上面这些使用的前提是需要导入By类:from selenium.webdriver.common.by import By

最简单粗暴却失传已久的8种定位
据说这种定位方式在江湖上都快要失传了,实在想不通为什么,明明写起来最简单粗暴啊~

driver.find_element("name","wd").send_keys("Selenium2")
driver.find_element("id","su").click()
相信通过上面的两只栗子,大家一定会和我一样觉得这种方式的定位实在是太省事了~只要写find_element就好啦,下面我们来总结一下这8种写法与基本定位方法类比过来该怎么写:

by_id -> find_element("id","")

by_xpath -> find_element("xpath","")

by_link_text -> find_element("link text","")

by_partial_text -> find_element("partial link text","")

by_name -> find_element("name","")

by_tag_name -> find_element("tag name","")

by_class_name -> find_element("class name","")

by_css_selector -> find_element("css selector","")

elements复数定位
在上面的例举的八中基本定位方式种,都有对应的复数形式,分别是下面这些:

id复数定位find_elements_by_id()
name复数定位find_elements_by_name()
class复数定位find_elements_by_class_name()
tag复数定位find_elements_by_tag_name()
link复数定位find_elements_by_link_text()
partial_link复数定位find_elements_by_partial_link_text()
xpath复数定位find_elements_by_xpath()
css复数定位find_elements_by_css_selector()
这些复数定位方式每次取到的都是具有相同类型属性的一组元素,所以返回的是一个list队列,我们也可以利用这个去定位单个的元素。比如百度首页种,右上角有新闻、视频、地图、贴吧等一些链接,我们通过f12查看源码可以发现,这些链接都有共同的class, class="mnav"。

举个例子,比如定位排在第六个的学术,可以这样定位:driver.find_elements_by_class_name("mnav")[5].click()

还可以通过css的复数定位写法:driver.find_elements("css selector",".mnav")[6].click()

当然,也可以借助pop()函数,一般pop()或pop(-1)表示获取元素种的最后一个,pop(2)表示第三个:

driver.find_elements("css selector",".mnav").pop().click()

JS的5种定位方式总结
其实看到这里,上面的定位方式应该就基本够用了,但是有的时候就是会出现一些诡异的定位失效或者定位到了点击失效的问题,这个时候如果用js进行直接执行该事件,往往就可以解决那些诡异的事情~

id定位:document.getElementById()
name定位:document.getElementsByName()
tag定位:document.getElementsByTagName()
class定位:document.getElementsByClassName()
css定位:document.querySelectorAll()
其中只有id对象用的是Element返回是单个对象,其他都是Elements返回的是一个list这点千万要注意,具体用法和上面的webdriver基础定位一样。先写好对应的js语句,可以先赋值给一个变量,然后后调用execute_script进行执行一下js就好了,下面还是结合那个百度搜索的栗子,我写的脚本,可以对应学习实验一下:

search_js = "document.getElementsByName('wd')[0].value='selenium';"
search_js2 = "document.querySelectorAll('.s_ipt')[0].value='selenium';"
button_js = "document.getElementById('su').click();"
button_js2 = "document.getElementsByClassName('s_btn')[0].click()"
driver.execute_script(search_js2)
driver.execute_script(button_js2)
以上分别结合常用的四种js定位方式写了四条js语句,然后要执行的就execute_script一下就好啦~

超神的jQuery定位
据说会jQuery定位的在定位的路上就是披襟斩棘,所向披靡~如此超神的定位,还是可以了解一下的~

jQuery语法是为HTML元素的选取编制的,可以对元素执行一些具体的操作

基础语法是$(selector).action()

$符号定义jQuery,selector选择器用来查询具体的HTML元素,通过action()来执行对元素的具体操作。

其中我们经常用到的action()在jq中有这么几种:

$(selector).val('input_value') 其中input_value表示要输入的文本的值

$(selector).val('') 如果为空,则执行后是清空的意思

$(selector).click() 行为也是肯定有的

让我们结合百度的栗子看一下,用jQuery的写法和js有一点点的类似,但明显简洁多了:

search_jq = "$('#kw').val('selenium')"
button_jq = "$('.s_btn').click()"
driver.execute_script(search_jq)
driver.execute_script(button_jq)

以上就是对webdriver的一些基本定位方式总结,我们再来回顾一下:

分别是……

8种webdriver的基本地位方式,还有对应的8种复数定位,js有5中定位方式,还有超神的jQuery定位,当然,不要忘了快要失传的那8种定位,一共是30种,在实际应用中,总有一种适合你(●ˇ∀ˇ●)

selenium8中元素定位方式的更多相关文章

  1. 6.1 python+appium元素定位方式(登录app)

    1.0.0     :常见的十种元素定位方式 .driver.find_element_by_id() #id定位 .driver.find_element_by_name() #name定位(已经凉 ...

  2. Java + Selenium + WebDriver八大元素定位方式

    UI自动化测试的第一步就是进行元素定位,下面给大家介绍一下Selenium + WebDriver的八大元素定位方式.现在我们就以百度搜索框为例进行元素定位,如下图: 一.By.name() Java ...

  3. Appium自动化(10) - appium高级元素定位方式之 UI Automator API 的详解

    如果你还想从头学起Appium,可以看看这个系列的文章哦! https://www.cnblogs.com/poloyy/category/1693896.html 前言 前面介绍过根据id,clas ...

  4. App自动化《元素定位方式、元素操作、混合应用、分层设计、代码方式执行Pytest 命令》

    坚持原创输出,点击蓝字关注我吧 作者:清菡 博客:oschina.云+社区.知乎等各大平台都有. 目录 一.App 元素定位方式 二.元素操作 三.测试混合应用 四.以代码的方式执行 Pytest 命 ...

  5. APPIUM-Android自动化元素定位方式

    一.常用元素定位方法 appium从selenium中继承了所有的元素定位方法, 并且增加了一些自己的元素定位方式,下方截图分别为selenium和MobileBy包源码: 但是从继承selenium ...

  6. 【python+selenium的web自动化】- 8种元素定位方式详解

    ​ 我们在做WEB自动化时,最根本的就是操作页面上的各种元素,而操作的基础便是元素的定位,只有准确地定位到唯一元素才能进行后续的自动化控制,下面将对各种元素定位方式进行总结归纳. ​ 说明:以下操作统 ...

  7. App自动化之dom结构和元素定位方式(包含滑动列表定位)

    900×383 38 KB 先来看几个名词和解释: dom: Document Object Model 文档对象模型 dom应用: 最早应用于html和js的交互.界面的结构化描述, 常见的格式为h ...

  8. 技术分享 | app自动化测试(Android)--元素定位方式与隐式等待

    原文链接 元素定位是 UI 自动化测试中最关键的一步,假如没有定位到元素,也就无法完成对页面的操作.那么在页面中如何定位到想要的元素,本小节讨论 Appium 元素定位方式. Appium的元素定位方 ...

  9. 【基础】selenium中元素定位的常用方法(三)

    一.Selenium中元素定位共有八种 id name className tagName linkText partialLinkText xpath cssSelector 其中前六种都比较简单, ...

随机推荐

  1. Python 进程、线程、协程的介绍与使用

    一.必备的理论基础 二.操作系统发展史 三.进程理论 四.线程理论 五.协程 一.必备的理论基础 操作系统理论: 操作系统是一个协调\管理\控制计算机硬件资源与应用软件资源的控制程序 操作系统的两大功 ...

  2. 预告:Windows 7 + Tiny Linux 4.19 + XFS + Vmware Workstation 15 (PRO)下篇dockerの奥义

    困 困 等明天再写吧 主题将围绕在Vmware使用持久化XFS disk后machine rm default后不丢失images containers volumes etc.的奇观 并将展开部署c ...

  3. springboot-实现文件下载

    一 前言 本文实现的文件下载是使用Apache 的 commons-fileupload 实现:在之前的springboot系列文件中已经讲述过如何实现多文件上传:这篇文件实现的文件下载功能主要是能在 ...

  4. asp.net core 实现支持多语言

    asp.net core 实现支持多语言 Intro 最近有一个外国友人通过邮件联系我,想用我的活动室预约,但是还没支持多语言,基本上都是写死的中文,所以最近想支持一下更多语言,于是有了多语言方面的一 ...

  5. Asp.Net Core下的开源任务调度平台ScheduleMaster

    从何说起 2017年初的时候,由于当时项目需要做了一个乞丐版定时调度系统,那时候只在单机上实现了核心的调度功能.做这个玩意之前也调研了社区中开源的解决方案,找了几个实地部署试跑了一下,其实都很不错.但 ...

  6. 投票:OAuth2.0 技术选型你会怎么选

    1. 前言 在使用 OAuth2.0 中 Authorization Server (授权服务器)是一个回避不了的设施,在大多数情况下我们调用的是一些知名的.可靠的.可信任的第三方平台,比如 QQ.微 ...

  7. 基于bootstrap的下拉选择 ( combox ) 输入 ( input ) 功能

    需求: 在编辑数据的时候,既可以让用户输入,也可以从下拉框中选择 思路: 参照下面的效果图,因为是表格里面的数据,所以下拉框触发按钮和输入框分别为1列,输入列可以设置是否输入(方法:<td co ...

  8. js中排序方法sort() 和 reverse()

    reverse() 作用:反转原数组. 用法: array.reverse(); 图解: sort() 作用:对原数组进行排序.默认将每个数组项 先 转换为字符串 再 进行字符串对比后升序排序. 用法 ...

  9. TCP/IP协议与HTTP协议(二)

    TCP/IP协议是传输层协议,主要解决数据如何在网络中传输,而HTTP是应用层协议,主要解决如何包装数据. 1.TCP连接 手机能够使用联网功能是因为手机底层实现了TCP/IP协议,可以使手机终端通过 ...

  10. objectarx 按比例分割封闭多段线

    测试结果:这个是按0.1,0.1,0.1,0.3,0.4的比例划分的. 插件描述:这个插件主要是选择一个多段线poly,设置poly的close属性为true,在poly任意一侧画一条长线line(l ...