WebDriver Selenium：需要在某些元素之后选择表格中的元素

Question

HTML 页面包含用户详细信息表。
我需要删除用户。
我可以通过用户名选择行中的第一个元素。
我需要选择该行上的“删除”按钮来删除该用户。
HTML 结构为：

<table id="tblUsersGrid" cellpadding="2">  
<thead>  
<tbody>
<tr class="aboutMeRow" data-parentid="223">  
<tr>  
<tr>  
 ...
<tr>
    <td class="cell cell_278 cell_NameCell">xoxo</td>
    <td class="optionIcon overrideFloat orgIcon cell cell_278 gridCell"></td>  
    <td class="cell cell_278 gridCell">Custom</td>  
    <td class="cell cell_278 gridCell">qaadmin</td>  
    <td class="cell cell_278 gridCell">0</td>  
    <td class="cell gridCell">  
        <div class="removeAccountIcon"></div>  
    <td class="cell gridCell">  
        <div class="editAccountIcon"></div>  
    </td>  
    <td></td>  
</tr>  

所以我可以通过

轻松选择所需的行

driver.findElement(By.xpath("//td[@class='cell_NameCell'][contains(text(),'xoxo')]"))  

但是我怎样才能到达该行的removeAccountIcon 元素呢？
我看到很多关于在表格中选择元素的问题，但没有找到解决这个问题的方法。
有没有办法通过CSS 选择器来做到这一点，而不仅仅是Xpath？ （我确信有一个Xpath 解决方案）。

Answer 1

您可以使用以下XPath 表达式一次性完成：

//tr[td[contains(@class, 'cell_NameCell')] = 'xoxo']//div[@class='removeAccountIcon']

在这里，我们通过检查包含cell_NameCell 类（这是您的用户名单元格）的td 元素的文本来定位适当的tr 行。然后，我们在这一行中找到“删除帐户图标”。

Answer 2

Xpath 轴preceding-sibling 将帮助您解决问题。你可以试试下面的xpath：

//td[preceding-sibling::td[contains(text(),'xoxo')]][5]/div[@class='removeAccountIcon']

让我知道它是否适合你。

Answer 3

如果您可以选择正确的行，则可以通过在该行上调用 findElement 而不是原始驱动程序来选择该行中所需的元素。但是，您建议用于查找正确行的代码似乎不起作用。 （它选择 td 而不是 tr。）

我建议如下：

WebElement userDataInRow = driver.findElement(By.xpath(//td[contains(text(),'xoxo')]))
WebElement row = userDataInRow.findElement(By.xpath(".."))
row.findElement(By.xpath("//div[@class='removeAccountIcon']"))

第二行转到所选 td 元素的父元素。

Answer 4

我认为没有使用 css 选择器来查找父级的选项。 This 文章提供了其他替代方法来找到相同的。

要使用 xpath 捕获“删除”按钮，我们只需要遍历表的“名称”单元格的父级，然后获取“删除链接/按钮”的“div”。

那么你的 xpath //td[@class='cell'][contains(text(),'xoxo')] 应该更新如下：

//td[contains(text(),'xoxo')]/../td/div[@class='removeAccountIcon']

这将根据给定名称捕获“删除帐户图标”。