基于文本值定位span元素：CSS选择器span:contains('test123')失效求助

问题核心 #

你用到的span:contains('test123')不属于标准CSS语法，这就是它无法生效的原因。:contains()是早期CSS草案的提案，但最终未被纳入正式标准，仅部分旧浏览器或jQuery这类框架对其做了扩展支持，现代浏览器和多数自动化测试工具默认不识别这个伪类。

基于文本值定位元素的可行方案 #

1. JavaScript结合CSS选择器过滤 #

如果是在前端代码里，可先用基础CSS选择器缩小范围，再通过JavaScript过滤文本内容：

// 获取所有class为abc的span，筛选文本等于test123的元素
const targetElement = Array.from(document.querySelectorAll('span.abc'))
  .find(el => el.textContent.trim() === 'test123');

2. 自动化测试场景下的处理 #

如果使用Selenium这类测试工具，除执行上述JavaScript脚本获取元素外，更可靠的方式是直接通过脚本查询：

// 示例：Selenium Java中执行脚本获取目标元素
WebElement target = (WebElement) ((JavascriptExecutor) driver).executeScript(
    "return Array.from(document.querySelectorAll('span.abc')).find(el => el.textContent.trim() === 'test123');"
);

3. 结合属性选择器的备选方案 #

如果目标元素的文本对应唯一属性（如id、class），可直接用属性选择器定位，稳定性优于文本匹配：

span#cell-123

或

span.abc[id^='cell-']

内容的提问来源于stack exchange，提问作者Pritam C.