如何用Playwright单查询筛选无text-decoration:line-through的元素？

可以直接通过单个CSS选择器实现需求，无需手动过滤，所有逻辑都包含在选择器中。

核心选择器 #

针对你的DOM结构，使用以下选择器即可选中所有不带text-decoration:line-through样式的子span元素：

span span:not([style*="text-decoration:line-through"]):not([style*="text-decoration: line-through"])

选择器说明 #

• span span：定位外层span下的所有子span元素
• :not([style*="text-decoration:line-through"])：排除style属性中包含text-decoration:line-through的元素
• 额外添加:not([style*="text-decoration: line-through"])是为了兼容样式值前带空格的写法（比如text-decoration: line-through），提升通用性

Playwright代码示例（Java版本） #

// 定位所有符合条件的元素
Locator targetElements = page.locator("span span:not([style*=\"text-decoration:line-through\"]):not([style*=\"text-decoration: line-through\"])");

// 如果需要获取第一个符合条件的元素，可直接链式调用
Locator firstTarget = targetElements.first();

这个选择器不受子span的顺序、数量影响，会自动筛选出所有不带删除线的元素，完全满足通用性要求。

内容的提问来源于stack exchange，提问作者user2173353