selenium 4.0学习(三)JS定位及demo脚本

简介: selenium 4.0学习(三)JS定位及demo脚本

做web自动化的同学基本绕不开selenium,虽然市面上已经有很多优秀框架比如cypress、testcafe等,但是selenium的大佬位置仍然坚挺!


本人使用环境

本机电脑:mac pro  intel

本地python:python3.7.9(推荐使用,不推荐高版本,除非有特殊需求)

pycharm:专业版(做自动化其实社区版即可)


一、selenium4.0结合JS定位(万能定位)

做web自动化的同学估计都会碰到,明明元素就在哪里,自带定位就是定位不到。明明在浏览器开发者模式调试能找到,脚本运行就找不到元素,这个试试,你可以试试几乎万能的js定位方式!

1、页面上下滚动

xxx参数代表的是横轴,0为左边,10000为右边,以此类推

yyy参数代表的是纵轴,0为上边,10000为下边,以此类推

图片.png

2、如果要上下滚动

图片.png


二、JS的5种定位方式

1.通过id获取 document.getElementById(“id”)

2.通过name获取  document.getElementsByName(“Name”) 返回的是list,注意下标

3.通过标签名选取元素 document.getElementsByTagName(“tag”)

4.通过CLASS类选取元素 document.getElementsByClassName(“class”)

5.通过CSS选择器选取元素 document.querySelectorAll(“css selector")

使用:(其他定位以此类推)

image.png

通过chrome开发者模式调试js定位:

image.png

三、百度查询完整业务流程

图片.png

image.png


欢迎指正、讨论与学习!


相关文章
|
21天前
|
JSON 移动开发 JavaScript
在浏览器执行js脚本的两种方式
【10月更文挑战第20天】本文介绍了在浏览器中执行HTTP请求的两种方式:`fetch`和`XMLHttpRequest`。`fetch`支持GET和POST请求,返回Promise对象,可以方便地处理异步操作。`XMLHttpRequest`则通过回调函数处理请求结果,适用于需要兼容旧浏览器的场景。文中还提供了具体的代码示例。
在浏览器执行js脚本的两种方式
|
8天前
|
存储 JavaScript 前端开发
JavaScript学习第一章
本文档介绍了JavaScript的基础知识,包括其在网页中的作用、如何通过JavaScript动态设置HTML元素的CSS属性,以及JavaScript中的变量类型(`var`、`let`、`const`)和数据类型(基本数据类型与引用数据类型)。通过实例代码详细解释了JavaScript的核心概念,适合初学者入门学习。
|
1月前
|
JavaScript
js学习--制作猜数字
js学习--制作猜数字
38 4
js学习--制作猜数字
|
1月前
|
JavaScript
webpack学习五:webpack的配置文件webpack.config.js分离,分离成开发环境配置文件和生产环境配置文件
这篇文章介绍了如何将webpack的配置文件分离成开发环境和生产环境的配置文件,以提高打包效率。
48 1
webpack学习五:webpack的配置文件webpack.config.js分离,分离成开发环境配置文件和生产环境配置文件
|
1月前
|
JavaScript
js学习--商品列表商品详情
js学习--商品列表商品详情
20 2
|
1月前
|
JavaScript
js学习--九宫格抽奖
js学习--九宫格抽奖
19 2
|
1月前
|
JavaScript
js学习--开屏弹窗
js学习--开屏弹窗
36 1
|
1月前
|
JavaScript
js学习--抽奖
js学习--抽奖
16 1
|
1月前
|
JavaScript
js学习--隔行换色
js学习--隔行换色
31 1
|
1月前
|
JavaScript 前端开发 容器
js之dom学习
js之dom学习
38 0
下一篇
无影云桌面