网站首页 > 知识剖析 正文
无论是做UI自动化测试,还是爬虫,页面元素定位始终都是我们必须要做的工作,Selenium WebDriver API 中提供了大量的方法帮助我们进行元素定位,有许多方法对页面的元素进行定位,可以根据自己的需要选择最合适的一种。selenium提供了8种元素定位的方法。
在前端的单个页面中,通过id定位是万无一失的,因为id值是唯一的。但是,并不是每个元素都有id属性,所以我们可以通过其他元素进行元素定位。
今天要说的就是元素定位方法之一:class定位。
一、简单class定位
如果一个属性有class值,我们要定位该元素可能方式是多样的
1. 首先想到可以根据class name进行定位。
代码如下:
driver.find_element(By.CLASS_NAME, “s_ipt”)
2. 同时也可以根据xpath定位:
代码如下:
driver.find_element(By.XPATH, ‘//input[@s_ipt=’s_ipt’”)
3. 第三种方法根据css selector定位:
代码如下:
driver.find_element(By.CSS_SELECTOR, “.s_ipt”)
二、复合class定位
如上图span元素,class值比较长,关键中间有空格,这种称之为复合class。
定位元素的时候方式如下
1. 根据class name进行定位时,每次只能选取其中一个name值定位。
代码如下:
driver.find_element(By.CLASS_NAME, “s_btn_wr”)
或者driver.find_element(By.CLASS_NAME, “bg”)
2. 可以根据xpath定位,直接做字符串匹配与前边相同:
代码如下:
driver.find_element(By.XPATH, ‘//input[@s_ipt=’bg s_ipt’”)
3. 第三种方法根据css selector定位:
代码如下:
driver.find_element(By.CSS_SELECTOR, “.bg.s_ipt”) # 即查找class name为bg和s_ipt的元素
driver.find_element(By.CSS_SELECTOR, “.s_ipt”) # 查找class name为s_ipt的元素
举个例子,拿百度首页的源码给大家说明一下,在页面源码文件,定位到元素后,右键,效果如下:
生成代码后复制,针对这个场景可以直接拿来用,但基于现在的网页更新都很频繁,建议还是要简单学习下xpath、css selector等方法,毕竟这些是比较重要的,那样就可以写出相对灵活的代码,在日常很有帮助,对页面一些的细小的调整会有更强的适应性。
综上所述,并不是所有的元素根据class值进行定位时,直接把值复制过来匹配即可,在不同的定位方式中其书写是不同的,同时有简单和复合class的区分。
- 上一篇: JS中的类?class语法糖??? 两分钟秒了
- 下一篇: JavaScript三种动态改变样式属性
猜你喜欢
- 2025-01-13 「Tomcat优化篇」如何让你的Tomcat性能更加优越 一遍就懂
- 2025-01-13 C# 13 和 .NET 9 全知道 :14 使用 Blazor 构建交互式 Web 组件 (2)
- 2025-01-13 零基础学习HTML之CSS篇样式优先权和字体样式与段落样式
- 2025-01-13 python散装笔记——38: Classes - 类(2)
- 2025-01-13 CSS display 属性用法详解
- 2025-01-13 JavaScript三种动态改变样式属性
- 2025-01-13 Vue3 样式绑定: 内联样式与Class属性的数组语法
- 2025-01-13 JS中的类?class语法糖??? 两分钟秒了
- 2025-01-13 一文读懂Java的Class文件结构
- 最近发表
- 标签列表
-
- xml (46)
- css animation (57)
- array_slice (60)
- htmlspecialchars (54)
- position: absolute (54)
- datediff函数 (47)
- array_pop (49)
- jsmap (52)
- toggleclass (43)
- console.time (63)
- .sql (41)
- ahref (40)
- js json.parse (59)
- html复选框 (60)
- css 透明 (44)
- css 颜色 (47)
- php replace (41)
- css nth-child (48)
- min-height (40)
- xml schema (44)
- css 最后一个元素 (46)
- location.origin (44)
- table border (49)
- html tr (40)
- video controls (49)