Question

我正在尝试使用cssSelector代替xpath。我打开了美国有线电视新闻网（CNN）的网站，将xpath的政治音乐放在首位。然后尝试使用cssSelector选择它。我无法弄清楚我写的cssSelector中有什么不对。我得到了NoSuchElementException

线程中的异常＆＃34; main＆＃34; org.openqa.selenium.NoSuchElementException：没有这样的元素：无法找到元素：{＆＃34;方法＆＃34;：＆＃34; css选择器＆＃34;，＆＃34;选择器＆＃34;：＆＃34; * [id =＆＃39; nav＆＃39;] div：nth-child（2）div：nth-child（2）a：nth-child（3）＆＃34;}

这是代码

WebDriver driver = new ChromeDriver();
driver.manage().window().maximize();
driver.manage().timeouts().implicitlyWait(20,TimeUnit.SECONDS);
driver.get("http://cnn.com");
//driver.findElement(By.xpath("//*[@id='nav']/div[2]/div[2]/a[3]")).click();
driver.findElement(By.cssSelector("*[id='nav'] div:nth-child(2) div:nth-child(2) a:nth-child(3)")).click();

Answer 1

选择器中的第二个div:nth-child(2)实际上应该是div:nth-child(3)，第一个<a>标记也是一个孩子。您也不应将*与cssSelctor

一起使用

driver.findElement(By.cssSelector("[id='nav'] div:nth-child(2) div:nth-child(3) a:nth-child(2)")).click();

您也可以使用班级nav-menu-links作为起点

driver.findElement(By.cssSelector("[class='nav-menu-links'] a:nth-child(2)")).click();

或部分data-analytics-header属性

driver.findElement(By.cssSelector("[data-analytics-header*='main-menu_politics']")).click();

Answer 2

我是CSS选择器的主要支持者而不是其他任何东西，但在这种情况下，我可能会使用链接文本而不是CSS选择器。之后，我会使用像//div[@id='nav']//a[.='Politics']这样的XPath。如果我必须使用CSS选择器，我会使用a[data-analytics-header='main-menu_politics']。

Answer 3

首先，如果可能的话首先避免:nth-child，而是使用类，ID或其他（或多或少）明确的属性来查找元素。

例如，您提供的XPath指向cnn.com上的Money部分，而不是Politics。

您应该使用[data-analytics-header='main-menu_politics']或.nav-menu-links__link[href='/politics']。

此外，您可以使用#nav代替*[id='nav']和.CLASSNAME代替[class='CLASSNAME']。在w3schools.com处有一个方便的css选择器概述。

尝试使用CssSelector时，在Selenium webdriver中找到NoSuchElementException

3 个答案: