我们在进行web自动化测试的时候进行XPath或者CSS定位,需要检测页面元素定位是否正确,如果用脚本去检测,那么效率是极低的。

一般网上推选装额外的插件来实现页面元素定位检测 如:firebug。

其实F12开发者工具就能直接在页面上检测元素定位不需要装额外的插件。

有2种方式:

  • F12开发者自带的elements定位,支持xpath css定位。
  • JS方法定位,通过console输入,支持id、Name、ClassName、TagName定位,CSS不支持xpath方式定位。

elements定位

使用方法:

F12开启开发者工具后按Ctrl + F组合键

Element标签下,会多出一个body输入框。

这个输入框可以使用xpath css定位和关键字查找。

右下角显示选中的和总共定位的元素。

JS方法定位:

第二种通过JS自带的方法来定位。显示效果比第一种要更好。

  CSS定位

  • document.querySelector()
  • document.querySelectorAll()

其他方式定位

  • document.getElementById()
  • document.getElementsByName()
  • document.getElementsByClassName()
  • document.getElementsByTagName()

看方法名就能知道用途。

我一般用document.querySelectorAll()定位所有元素。既能定位一组元素还能 在定位一个元素的时候检测是否定位到多个元素。

使用方法

  打开F12开发者工具 切换到Console控制台标签。

  输入JS元素定位方法

不废话,看下图示例

Selenium元素定位之页面检测技巧的更多相关文章

  1. 自动化测试基础篇--Selenium元素定位

    摘自https://www.cnblogs.com/sanzangTst/p/7457111.html 一.Selenium元素定位的重要性: Web自动化测试的操作:获取UI页面的元素,对元素进行操 ...

  2. Selenium3 + Python3自动化测试系列二——selenium元素定位

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

  3. selenium元素定位陷阱规避

    为什么selenium可以在各个浏览器上运行?因为selenium在与各个浏览器驱动执行前,会先把脚本转化成webdriver, webdriver wire协议(一种json格式的协议),这样就与脚 ...

  4. selenium元素定位之css选择器

    在selenium元素定位时会用到css选择器选取元素,虽说xpath在定位元素时能解决大部分问题,但使用css选择器选取元素也是一种不错的选择. css相较与xpath选择元素优点如下: 表达式更加 ...

  5. selenium元素定位篇

    Selenium webdriver是完全模拟用户在对浏览器进行操作,所有用户都是在页面进行的单击.双击.输入.滚动等操作,而webdriver也是一样,所以需要我们指定元素让webdriver进行单 ...

  6. python学习之——selenium元素定位

    web自动化测试按步骤拆分,可以分为四步操作:定位元素,操作元素,获取返回结果,断言(返回结果与期望结果是否一致),最后自动出测试报告. 其中定位元素尤为关键,此篇是使用webdriver通过页面各个 ...

  7. python selenium 元素定位(三)

    上两篇的博文中介绍了python selenium的环境搭建和编写的第一个自动化测试脚本,从第二篇的例子中看出来再做UI级别的自动化测试的时候,有一个至关重要的因素,那就是元素的定位,只有从页面上找到 ...

  8. selenium元素定位大全

    要做自动化,首先要了解页面结构,要了解页面结构,就要了解页面元素的定位方法 在使用selenium webdriver进行元素定位时,通常使用findElement或findElements方法结合B ...

  9. selenium元素定位

    在网页自动化测试中,我们要让程序自动模拟我们的点击.输入.悬浮.拖动等操作,完成我们的测试用例组. 输入.点击.打开这样的动词,已经包含在了selenium的方法中,可以直接调用(当然你也可以自己写) ...

随机推荐

  1. Docker最全教程---从理论到实战

    目录 前言 随着生产力的发展尤其是弹性架构的广泛应用(比如微服务),许多一流开发者都将应用托管到了应用容器上,比如Google.微软.亚马逊.腾讯.阿里.京东和新浪. 从未来的发展方向来看,容器引擎将 ...

  2. STL初学

    标准模板库STL初学 线性数据结构 vector 一维向量,相当于数组 list 链表 map 映射,提供(Key,Value)式操作,相当于哈希表 string char字符串 queue 队列,先 ...

  3. 2019-08-12 纪中NOIP模拟B组

    T1 [JZOJ4879] 少女觉 题目描述 “在幽暗的地灵殿中,居住着一位少女,名为古明地觉.” “据说,从来没有人敢踏入过那座地灵殿,因为人们恐惧于觉一族拥有的能力——读心.” “掌控人心者,可控 ...

  4. opencv3.2.0+opencv_contrib-3.2.0+vs2015相关文件的配置

    包含目录:E:\opencvcontrib\opencv\sources\build\install\include\opencv E:\opencvcontrib\opencv\sources\bu ...

  5. go语言 base64编码解码

    package main import ( "encoding/base64" "fmt" ) func main() { str := "Man&q ...

  6. linux修改主机名(hostname)

    修改/etc/sysconfig/network文件并重启

  7. IN中超过1000处理

    后台 所有用到IN的方法,都要考虑超过1000的可能 if(cameraIds != null && cameraIds.length > 0){sql.append(" ...

  8. this.$nextTick

    首先我们先来看看官方介绍的用法: 将回调延迟到下次 DOM 更新循环之后执行.在修改数据之后立即使用它,然后等待 DOM 更新. 它跟全局方法 Vue.nextTick 一样,不同的是回调的 this ...

  9. 松软科技web教程:JavaScript HTML DOM 事件监听器

    addEventListener() 方法 实例 添加当用户点击按钮时触发的事件监听器: document.getElementById("myBtn").addEventList ...

  10. eclipse出错

    程序初次build project没有问题,代码没有做任何修改再次build project却出现了make[1]: ***这样的错误,这是为什么?尝试过修改一点代码后重新编译也可能出现make[1] ...