我们在进行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. vs2017+resharper之常用快捷键备忘

    1.安装resharper后以vs2017的快捷键为主,让resharper作为一些方便的快捷键的补充. 2.vs2017的c++6的键盘布局模式快捷键 IntelliSence: 列表成员: Ctr ...

  2. 关于vue 里:class 的几种使用方式

    最近一直在做vue项目 从网上搜索到的资料不太多.关于:class的使用 结合自己的实现 整理如下.接下来一篇写:style .其实从:class 这里可以想到:style的使用 也是类似的 一 cl ...

  3. centos7 防火墙的操作

    参考文章:http://blog.csdn.net/Joe68227597/article/details/75207859 http://www.cnblogs.com/cocoat/p/66054 ...

  4. 虚拟路径引起的bug

    之前,遇到一个问题,就是,项目访问不了最新产生的pdf文件. 百思不得其解,为什么,返回 idea 页面就可以访问了(真的只是返回 idea 页面,不进行其他什么的操作).一直以为是热部署的问题 后来 ...

  5. C#.net连接Sybase的方法

    一 .ODBC方式连接 1 安装Sybase客户端,安装ODBC驱动,配置DSN<略> 2 连接代码 string strconn = "DSN=TEST;SRVR=TEST;D ...

  6. Win系统如何修改远程桌面端口3389

    Win系统如何修改远程桌面端口3389: https://jingyan.baidu.com/article/ce43664928d5293773afd39b.html window10远程桌面连接: ...

  7. python3安装虚拟环境(windows)

    1.pip install virtualenv   :安装命令 2.pip install virtualenvwrapper-win:安装命令 3.配置WORKON_HOME环境变量: 变量名:W ...

  8. dojo - 相关教程

    https://blog.csdn.net/dojotoolkit/article/details/6688058

  9. python logging模块日志回滚RotatingFileHandler

    # coding=utf-8 import logging import time import os import logging.handlers def logger(appname,roots ...

  10. C++的多态总结(静态&动态)

    什么是多态 顾名思义就是同一个事物在不同场景下的多种形态. 静态多态 我们以前说过的函数重载就是一个简单的静态多态,静态多态是编译器在编译期间完成的,编译器会根据实参类型来选择调用合适的函数,如果有合 ...