Selenium/Python 无法在 CSS_SELECTOR 中使用`:contains()` [重复]答案

【问题标题】：Selenium/Python Unable to use `:contains()` in CSS_SELECTOR [duplicate]Selenium/Python 无法在 CSS_SELECTOR 中使用`:contains()` [重复]
【发布时间】：2021-12-20 05:21:38
【问题描述】：

当我尝试在 Selenium 的By.CSS_SELECTOR 中使用:contains 时，比如

presence = EC.presence_of_element_located((By.CSS_SELECTOR, ".btn:contains('Continue Shopping')"))

或

presence = EC.presence_of_element_located((By.CSS_SELECTOR, ".btn\:contains('Continue Shopping')"))

或

presence = EC.presence_of_element_located((By.CSS_SELECTOR, ".btn\\:contains('Continue Shopping')"))

Python 程序因错误而崩溃

Exception: Message: invalid selector: An invalid or illegal selector was specified
  (Session info: chrome=95.0.4638.54)

是否可以在 Selenium 中使用:contains？ CSS 选择器

$('.btn:contains("Continue Shopping")')

在 Chrome 的 JS 控制台中运行良好。

在 Ubuntu 20.04 上使用 Chrome 95.0.4638.54、ChromeDriver 95.0.4638.54、Python 3.10。

【问题讨论】：

标签： python python-3.x selenium selenium-webdriver selenium-chromedriver

【解决方案1】：

选择器:contains('text') 是jQuery selector，而不是像 Selenium 所期望的那样有效的 CSS selector。我假设它通过 Chrome 的 DevTools 控制台在页面上运行的原因是因为该页面上定义了 jQuery。

不幸的是，我不相信您可以使用 CSS 选择器 (link) 通过其文本直接选择元素。

据我所知，您有两个选择：

将选择器更改为基于类或 ID（最简单）
创建一个 Selenium 实用程序来运行使用此 jQuery 选择器的 JS 脚本；例如execute_script("jQuery(" + id + ":contains('" + text + "')", id, text)

【讨论】：

哦...是否可以将'.btn:contains("Continue Shopping")' 转换为 XPath 选择器？我似乎无法弄清楚。如果是这样，我们可以在 Selenium 中使用By.XPATH。

【解决方案2】：

正如 Aspok 所述，您的 CSS 定位器不是有效的 CSS 定位器。
要根据文本定位元素，您可以使用 XPath 定位器，例如：

//*[contains(@class,'btn') and(contains(text(),'Continue Shopping'))]

如果 btn 是该元素的唯一类名属性，您的 XPath 可以是

//*[@class='btn' and(contains(text(),'Continue Shopping'))]

【讨论】：

【解决方案3】：

正如@aspok 所解释的，它不是一个有效的 css 选择器。

如果您想使用相同的 XPath，并且 .btn 是类并且具有文本/部分文本

Continue Shopping

你可以试试下面的 XPath：

//*[contains(text(),'Continue Shopping')]

或

//*[contains(text(), 'Continue Shopping') and contains(@class, 'btn')]

如果我们在HTML DOM 中有唯一条目，请检查dev tools（谷歌浏览器）。

你应该检查的xpath：

//*[contains(text(), 'Continue Shopping') and contains(@class, 'btn')]

检查步骤：

Press F12 in Chrome -> 转到element 部分 -> 做一个CTRL + F -> 然后粘贴xpath 看看，如果你想要的element 用@ 得到突出显示 987654333@匹配节点。

另外，请注意，如果您发现多个匹配节点，//* 可以替换为 tag name。

【讨论】：