OpenQA.Selenium.InvalidSelectorException：'无效的选择器：在 Selenium 中指定了无效或非法的选择器错误

Question

我在 CS 中使用 chromedriver 使用 css 选择器查找元素但是我收到以下错误：

OpenQA.Selenium.InvalidSelectorException: 'invalid selector: An invalid or illegal selector was specified

我的代码：

var body = driver.FindElementsByCssSelector(".add-to-cart.float-right.font-montserratSemiBold.text-11.lg:text-12.text-secondary.flex.flex-wrap.leading-articlesmall");

我正在尝试在this website 上找到Add to basket 按钮的元素

我的选择器出了什么问题，我该如何解决这个问题？

Answer 1

此错误消息...

OpenQA.Selenium.InvalidSelectorException: 'invalid selector: An invalid or illegal selector was specified

...暗示WebDriver 实例无法找到所需的WebElement 无效。

css-selectors 几乎是完美的，但问题在于 : 和lg:text-12 一样。字符 : 在 css-selectors 中使用时具有特殊效果，因为它用于几个 css-selectors 变体中。几个例子：

• input:enabled
• p:first-child
• p:first-of-type
• :not(p)
• p:nth-child(2)
• p:nth-last-of-type(2)

---

解决方案

有两种解决方案。

• 在第一种方法中，您可以转义 : 字符。
• 在第二种也是最有效的方法中，您可以使用单个静态 classname，而不是提及所有 class 属性，它将所有带有文本的元素标识为 添加到购物篮如下：

  • css 选择器：

    button.add-to-cart
    

  • xpath

    //button[contains(@class, 'add-to-cart')]
    

快照：

---

参考文献

您可以在以下位置找到一些相关的详细讨论：

• Python: find_element_by_css_selector

Answer 2

试试这个选择器：

var body = driver.FindElementsByCssSelector(".add-to-cart");

Answer 3

请尝试在 : in lg:text-12 前添加双反斜杠转义字符，如下所示

var body = driver.FindElements(By.CssSelector(".add-to-cart.float-right.font-montserratSemiBold.text-11.lg\\:text-12.text-secondary.flex.flex-wrap.leading-articlesmall"));

在我的本地测试过，返回 11 个元素效果很好。

Answer 4

You can use findelements method in selenium 

List<WebElement> products=driver.findElements(By.xpath("//button[contains(text(),'Add to basket')]"));

// if you want to pick 1 st product you can use below code 
        products.get(0).click();