Selenium 与 JS 如何计算父元素中的子元素

Question

我得到了以下 HTML 结构：

<ul id="test">
   <li><div><span>name one</span></div></li>
   <li><div><span>name two</span></div></li>
   <li><div><span>name three</span></div></li>
   <li><div><span>name four</span></div></li>
</ul>

我的第一个问题是如何使用 Selenium 获取 li 标签的数量。 在柏树中很简单：

cy.get('#test').children().should('have.length', 4)

我的第二个问题是： 我怎么能在这个 ul 中得到第 n 个孩子？ 我尝试这样做：

const firstName = await d.driver.findElements(By.xpath("//ul[contains(@id, 'test')]/li/div/span")).getText()

这里我得到了第一个 li 文本，但是我怎么能得到里面剩下的列表的文本呢？

const secondManualName = await d.driver.findElement(By.cssSelector("ul[contains(@id, 'test')]>li:nth-child(2)>div>span")).getText()

在上面的代码行中，它抛出了一个错误，即没有这样的函数。我不明白为什么硒文档如此不完整。如果您向我推荐一些带有 JS 的 selenium 好网站，我将不胜感激（带有一些很好的例子）。

Answer 1

要在<ul> 中获取nth <li> child，您可以使用以下任一Locator Strategies：

• cssSelector:

  ul#test li:nth-child(n) > div > span
  where, n = 2,3,4 etc.
  

• 有效的代码行：

  await driver.findElement(By.css("ul#test li:nth-child(2) > div > span")).getText()
  

• xpath:

  //ul[@id='test']//following::li[n]/div/span
  where, n = 2,3,4 etc.
  

• 有效的代码行：

  await driver.findElements(By.xpath("//ul[@id='test']//following::li[2]/div/span")).getText()