Selenium 遇见伪元素该如何处理?

news/2025/4/1 11:10:58/

问题发生

在很多前端页面中,大家会见到很多::before、::after 元素,比如【百度流量研究院】:

比如【百度疫情大数据平台】:

以【百度疫情大数据平台】为例,“累计确诊”文本并没有显示在 HTML 源代码中,如果通过常规的 xpath 元素定位方式是没办法的,因为“累计确诊”文本并不存在当前页面 dom 树中。

如何处理?

我们要弄清楚的是该元素的特殊之处,文本究竟存放在哪?

其实很简单,通过 Chrome 的 F12,我们将 style 选项展示出来:

可以看到元素的文本保存在 CSS 样式里面,通过 content 属性进行设置。

这里还有个小问题:文本根本对不上呢?

因为这里使用了 Unicode 编码,使用在线的 Unicode 编码转换工具即可看到

::after 元素也是同理,这种性质的元素我们称之为伪元素:

之所以被称为伪元素,是因为他们不是真正的页面元素,HTML 没有对应的元素,但是其所有用法和表现行为与真正的页面元素一样,可以对其使用诸如页面元素一样的 CSS 样式,表面上看上去貌似是页面的某些元素来展现,实际上是 CSS 样式展现的行为,因此被称为伪元素。

一、伪元素的定位

由于伪元素是通过 CSS 样式展现的行为,所以我们可以通过 CSS 样式选择器来进行定位,以“百度疫情大数据为例”:

1.先定位伪元素的父元素:div.Virus_1-1-318_3W7bs_

2.再定位到伪元素本身:div.Virus_1-1-318_3W7bs_>label

二、伪元素文本的获取

有些情况下我们需要获取到文本信息,其中伪元素的文本主要是通过 content 属性设置,我们可以通过 JavaScript 可以进行提取:

Selenium 中调用 JavaScript:

JavascriptExecutor jsExecutor = (JavascriptExecutor) driver;
jsExecutor.executeScript("window.getComputedStyle(document.querySelector('.Virus_1-1-318_1KG-A3'),'

最后感谢每一个认真阅读我文章的人,礼尚往来总是要有的,虽然不是什么很值钱的东西,如果你用得到的话可以直接拿走:

在这里插入图片描述

软件测试面试小程序

被百万人刷爆的软件测试题库!!!谁用谁知道!!!全网最全面试刷题小程序,手机就可以刷题,地铁上公交上,卷起来!

涵盖以下这些面试题板块:

1、软件测试基础理论 ,2、web,app,接口功能测试 ,3、网络 ,4、数据库 ,5、linux

6、web,app,接口自动化 ,7、性能测试 ,8、编程基础,9、hr面试题 ,10、开放性测试题,11、安全测试,12、计算机基础

这些资料,对于【软件测试】的朋友来说应该是最全面最完整的备战仓库,这个仓库也陪伴上万个测试工程师们走过最艰难的路程,希望也能帮助到你!


http://www.ppmy.cn/news/1064283.html

相关文章

CotEditor for mac 4.0.1 中文版(开源文本编辑器)

coteditorformac是一款简单实用的基于Cocoa的macOS纯文本编辑器,coteditormac版本可以用来编辑网页、结构化文本、程序源代码等文本文件,使用起来非常方便。 CotEditor for Mac具有正则表达式搜索和替换、语法高亮、编码等实用功能,而CotEdi…

基于“互联网+ 服务供应链”的汽车道路救援系统对策分析

1。 建立“互联网服务供应链”背景下汽车道路救援系统 基于互联网的汽车道路救援,两级服务供应链结构是由服务提供商、服务 集成商和客户组成。“互联网服务供应链”背景下汽车道路救援系统组成, 它是一种 B2B2C 的形式,与前述传统汽车道路…

TCP拥塞控制详解 | 7. 超越TCP

网络传输问题本质上是对网络资源的共享和复用问题,因此拥塞控制是网络工程领域的核心问题之一,并且随着互联网和数据中心流量的爆炸式增长,相关算法和机制出现了很多创新,本系列是免费电子书《TCP Congestion Control: A Systems …

低功耗串口wifi模块在智能工厂解决方案中的数据透传应用

智能工厂解决方案必然是依赖于产品自身去完成信息采集,数据上传。目前基于串口WiFi模块的智慧工厂解决方案应用极为广泛。 工业物联网与串口WiFi模块 工业物联网是在制造和工业环境中,将连网仪器、传感器和其他设备与机械和流程连接起来的实现。创新的…

Python SimpleITK numpy ITK VTK 转换 保存 SAVE 转 jpg

有时我们需要 在 SimpleITK numpy vtk 数据之间相互转换,保存,转jpg图片等;#引入包import SimpleITK as sitk import numpy as np import cv2 import osimport vtkmodules.all as vtkfrom vtkmodules.util import * # numpy data to SimpleITK sitk imag sitk_image = sitk…

Spring与MyBatis集成 AOP整合PageHelper插件

目录 1.什么是集成? 2.Spring与MyBatis集成 3.Spring与MyBatis集成的基本配置 4.AOP整合PageHelper插件 1.什么是集成? 集成是指将不同的组件、框架或系统整合到一起,使它们可以协同工作、相互调用、共享资源等。通过集成,可以…

Java 语言实现线性查找算法

【引言】 线性查找算法是一种简单且直观的查找算法。它从数组的第一个元素开始逐个比较,直到找到目标元素,或者遍历完整个数组。本文将使用Java语言实现线性查找算法,并详细讲解其思想和代码实现。 【算法思想】 线性查找的核心思想是逐个比…

SQL 大小敏感问题

在SQL中,关键字和函数名 是不区分 大小写的 比如(select、where、order by 、group by update 等关键字),以及函数(ABS、MOD、round、min等) window系统默认是大小写不敏感 (ZEN文件和zen 文件 不能同时存在&#xff…