Question

HTML页面包含用户详细信息表我需要删除用户。
我可以通过用户名选择行中的第一个元素我需要选择＆＃34;删除＆＃34;该行上的按钮可删除该用户。
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']

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

Answer 2

如果可以选择正确的行，则可以通过在该行上调用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 3

我不认为可以通过使用css选择器找到父级。 This文章给出了其他替代方案以找到相同的内容。

捕获＆＃34;删除＆＃34;通过使用xpath按钮，我们只需要遍历回＆＃34; Name＆＃34;的父级。表的单元格，然后获取＆＃34; div＆＃34; ＆＃34;删除链接/按钮＆＃34;。

然后您的xpath //td[@class='cell'][contains(text(),'xoxo')]应更新如下：

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

这将捕获＆＃34;删除帐户图标＆＃34;基于给定的名称。

Answer 4

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

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

让我知道它是否适合你。

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

4 个答案: