如何单击引用不同元素的按钮? [英] How to click a button making reference to a different element?
本文介绍了如何单击引用不同元素的按钮?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我是 Selenium 的新手，昨天我遇到了一个问题，但找不到解决方案.所以，我有一个页面，我需要点击一个按钮，但这个页面还有其他同名的按钮.
见下图:
我正在尝试执行以下操作:
driver.findElement(By.Xpath(("//span[@class='slider round'] and//td[contains(.,'célula 1')]"));这是HTML代码:
<table _ngcontent-c8="" class="table w-100"><thead _ngcontent-c8=""><tr _ngcontent-c8="" align="center" height="50"><th _ngcontent-c8="">Nome</th><th _ngcontent-c8="" colspan="7">Ações</th></tr></thead><tbody _ngcontent-c8=""><!--bindings={"ng-reflect-ng-for-of": "[object Object],[object Object"}--><tr _ngcontent-c8="" align="center"><td _ngcontent-c8="">célula 1</td><td _ngcontent-c8=""><label _ngcontent-c8="" class="switch" ng-reflect-ngb-tooltip="Desativar célula"><input _ngcontent-c8="" type="checkbox" ng-reflect-model="1" class="ng-untouched ng-pristine ng-valid"><span _ngcontent-c8="" class="slider round"></span></td><td _ngcontent-c8=""><button _ngcontent-c8="" class="btn btn-primary" ngbtooltip="Alterar célula" place="top" type="button" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Alterar célula"><span _ngcontent-c8="" class="oi oi-pencil"></span></td><td _ngcontent-c8=""><button _ngcontent-c8="" class="btn btn-danger" ngbtooltip="Apagar célula" place="top" type="button" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Apagar célula"><span _ngcontent-c8="" class="oi oi-trash"></span></td><td _ngcontent-c8=""><button _ngcontent-c8="" class="btn btn-info" ngbtooltip="Configuração de célula"placement="top" type="button" tabindex="0" ng-reflect-router-link="/configuracao-celula" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Configuração de célula"><span _ngcontent-c8="" class="oi oi-wrench"></span></td><td _ngcontent-c8=""><button _ngcontent-c8="" class="btn btn-secondary" ngbtooltip="Campos da célula"placement="top" type="button" tabindex="0" ng-reflect-router-link="/campos" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Campos da célula"><span _ngcontent-c8="" class="oi oi-list"></span></td><td _ngcontent-c8=""><button _ngcontent-c8="" class="btn btn-dark" ngbtooltip="Tabulações da célula" place="top" type="button" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Tabulações da célula"><span _ngcontent-c8="" class="oi oi-bookmark"></span></td><td _ngcontent-c8=""><button _ngcontent-c8="" class="btn btn-warning" ngbtooltip="Configurar Pausa" place="top" type="button" tabindex="0" ng-reflect-router-link="/motivos-pausa,1" ng-reflect-placement="top" ng-reflect-ngb-tooltip="配置暂停"><span _ngcontent-c8="" class="oi oi-media-pause"></span></td></tr><tr _ngcontent-c8="" align="center"><td _ngcontent-c8="">célula 2</td><td _ngcontent-c8=""><label _ngcontent-c8="" class="switch" ng-reflect-ngb-tooltip="Desativar célula"><input _ngcontent-c8="" type="checkbox" ng-reflect-model="1" class="ng-untouched ng-pristine ng-valid"><span _ngcontent-c8="" class="slider round"></span></td><td _ngcontent-c8=""><button _ngcontent-c8="" class="btn btn-primary" ngbtooltip="Alterar célula" place="top" type="button" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Alterar célula"><span _ngcontent-c8="" class="oi oi-pencil"></span></td><td _ngcontent-c8=""><button _ngcontent-c8="" class="btn btn-danger" ngbtooltip="Apagar célula" place="top" type="button" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Apagar célula"><span _ngcontent-c8="" class="oi oi-trash"></span></td><td _ngcontent-c8=""><button _ngcontent-c8="" class="btn btn-info" ngbtooltip="Configuração de célula"placement="top" type="button" tabindex="0" ng-reflect-router-link="/configuracao-celula" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Configuração de célula"><span _ngcontent-c8="" class="oi oi-wrench"></span></td><td _ngcontent-c8=""><button _ngcontent-c8="" class="btn btn-secondary" ngbtooltip="Campos da célula"placement="top" type="button" tabindex="0" ng-reflect-router-link="/campos" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Campos da célula"><span _ngcontent-c8="" class="oi oi-list"></span></td><td _ngcontent-c8=""><button _ngcontent-c8="" class="btn btn-dark" ngbtooltip="Tabulações da célula" place="top" type="button" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Tabulações da célula"><span _ngcontent-c8="" class="oi oi-bookmark"></span></td><td _ngcontent-c8=""><button _ngcontent-c8="" class="btn btn-warning" ngbtooltip="Configurar Pausa" place="top" type="button" tabindex="0" ng-reflect-router-link="/motivos-pausa,2" ng-reflect-placement="top" ng-reflect-ngb-tooltip="配置暂停"><span _ngcontent-c8="" class="oi oi-media-pause"></span></td></tr><tr _ngcontent-c8="" align="center"><td _ngcontent-c8="">célula 3</td><td _ngcontent-c8=""><label _ngcontent-c8="" class="switch" ng-reflect-ngb-tooltip="Ativar célula"><input _ngcontent-c8="" type="checkbox" ng-reflect-model="0" class="ng-untouched ng-pristine ng-valid"><span _ngcontent-c8="" class="slider round"></span></td><td _ngcontent-c8=""><button _ngcontent-c8="" class="btn btn-primary" ngbtooltip="Alterar célula" place="top" type="button" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Alterar célula"><span _ngcontent-c8="" class="oi oi-pencil"></span></td><td _ngcontent-c8=""><button _ngcontent-c8="" class="btn btn-danger" ngbtooltip="Apagar célula" place="top" type="button" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Apagar célula"><span _ngcontent-c8="" class="oi oi-trash"></span></td><td _ngcontent-c8=""><button _ngcontent-c8="" class="btn btn-info" ngbtooltip="Configuração de célula"placement="top" type="button" tabindex="0" ng-reflect-router-link="/configuracao-celula" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Configuração de célula"><span _ngcontent-c8="" class="oi oi-wrench"></span></td><td _ngcontent-c8=""><button _ngcontent-c8="" class="btn btn-secondary" ngbtooltip="Campos da célula" place="top" type="button" tabindex="0" ng-reflect-router-link="/campos" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Campos da célula"><span _ngcontent-c8="" class="oi oi-list"></span></td><td _ngcontent-c8=""><button _ngcontent-c8="" class="btn btn-dark" ngbtooltip="Tabulações da célula" place="top" type="button" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Tabulações da célula"><span _ngcontent-c8="" class="oi oi-bookmark"></span></td><td _ngcontent-c8=""><button _ngcontent-c8="" class="btn btn-warning" ngbtooltip="Configurar Pausa" place="top" type="button" tabindex="0" ng-reflect-router-link="/motivos-pausa,57" ng-reflect-placement="top" ng-reflect-ngb-tooltip="配置暂停"><span _ngcontent-c8="" class="oi oi-media-pause"></span></td></tr></tbody> 解决方案
根据您分享的 HTML，不清楚哪个元素类似于 圆形滑块 图标.点击圆形滑块，因为元素是Angular 元素，您需要引入 WebDriverWait 以使 元素可点击，您可以使用以下任一解决方案:
driver.findElement(By.Xpath(("//td[contains(.,'célula 1')]//following::td[1]/label//span[@class='sliderround']")).click();//或者driver.findElement(By.Xpath(("//td[contains(.,'célula 1')]//following::td[1]/label/input[@class='ng-untouched ng-pristine ng-有效'和@type='checkbox']")).click();I'm new to Selenium and yesterday I came across a problem and I can't find the solution. So, I have a page with a button that I need to click but this page have other buttons with the same name.
See image below:
I was trying to do something like:
driver.findElement(By.Xpath(("//span[@class='slider round'] and //td[contains(.,'célula 1')]"));
Here is the HTML code:
<div _ngcontent-c8="">
<table _ngcontent-c8="" class="table w-100">
<thead _ngcontent-c8="">
<tr _ngcontent-c8="" align="center" height="50">
<th _ngcontent-c8="">Nome</th>
<th _ngcontent-c8="" colspan="7">Ações</th>
</tr>
</thead>
<tbody _ngcontent-c8="">
<!--bindings={
"ng-reflect-ng-for-of": "[object Object],[object Object"
}--><tr _ngcontent-c8="" align="center">
<td _ngcontent-c8="">célula 1</td>
<td _ngcontent-c8="">
<label _ngcontent-c8="" class="switch" ng-reflect-ngb-tooltip="Desativar célula">
<input _ngcontent-c8="" type="checkbox" ng-reflect-model="1" class="ng-untouched ng-pristine ng-valid">
<span _ngcontent-c8="" class="slider round"></span>
</label>
</td>
<td _ngcontent-c8="">
<button _ngcontent-c8="" class="btn btn-primary" ngbtooltip="Alterar célula" placement="top" type="button" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Alterar célula">
<span _ngcontent-c8="" class="oi oi-pencil"></span>
</button>
</td>
<td _ngcontent-c8="">
<button _ngcontent-c8="" class="btn btn-danger" ngbtooltip="Apagar célula" placement="top" type="button" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Apagar célula">
<span _ngcontent-c8="" class="oi oi-trash"></span>
</button>
</td>
<td _ngcontent-c8="">
<button _ngcontent-c8="" class="btn btn-info" ngbtooltip="Configuração de célula" placement="top" type="button" tabindex="0" ng-reflect-router-link="/configuracao-celula" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Configuração de célula">
<span _ngcontent-c8="" class="oi oi-wrench"></span>
</button>
</td>
<td _ngcontent-c8="">
<button _ngcontent-c8="" class="btn btn-secondary" ngbtooltip="Campos da célula" placement="top" type="button" tabindex="0" ng-reflect-router-link="/campos" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Campos da célula">
<span _ngcontent-c8="" class="oi oi-list"></span>
</button>
</td>
<td _ngcontent-c8="">
<button _ngcontent-c8="" class="btn btn-dark" ngbtooltip="Tabulações da célula" placement="top" type="button" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Tabulações da célula">
<span _ngcontent-c8="" class="oi oi-bookmark"></span>
</button>
</td>
<td _ngcontent-c8="">
<button _ngcontent-c8="" class="btn btn-warning" ngbtooltip="Configurar Pausa" placement="top" type="button" tabindex="0" ng-reflect-router-link="/motivos-pausa,1" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Configurar Pausa">
<span _ngcontent-c8="" class="oi oi-media-pause"></span>
</button>
</td>
</tr><tr _ngcontent-c8="" align="center">
<td _ngcontent-c8="">célula 2</td>
<td _ngcontent-c8="">
<label _ngcontent-c8="" class="switch" ng-reflect-ngb-tooltip="Desativar célula">
<input _ngcontent-c8="" type="checkbox" ng-reflect-model="1" class="ng-untouched ng-pristine ng-valid">
<span _ngcontent-c8="" class="slider round"></span>
</label>
</td>
<td _ngcontent-c8="">
<button _ngcontent-c8="" class="btn btn-primary" ngbtooltip="Alterar célula" placement="top" type="button" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Alterar célula">
<span _ngcontent-c8="" class="oi oi-pencil"></span>
</button>
</td>
<td _ngcontent-c8="">
<button _ngcontent-c8="" class="btn btn-danger" ngbtooltip="Apagar célula" placement="top" type="button" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Apagar célula">
<span _ngcontent-c8="" class="oi oi-trash"></span>
</button>
</td>
<td _ngcontent-c8="">
<button _ngcontent-c8="" class="btn btn-info" ngbtooltip="Configuração de célula" placement="top" type="button" tabindex="0" ng-reflect-router-link="/configuracao-celula" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Configuração de célula">
<span _ngcontent-c8="" class="oi oi-wrench"></span>
</button>
</td>
<td _ngcontent-c8="">
<button _ngcontent-c8="" class="btn btn-secondary" ngbtooltip="Campos da célula" placement="top" type="button" tabindex="0" ng-reflect-router-link="/campos" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Campos da célula">
<span _ngcontent-c8="" class="oi oi-list"></span>
</button>
</td>
<td _ngcontent-c8="">
<button _ngcontent-c8="" class="btn btn-dark" ngbtooltip="Tabulações da célula" placement="top" type="button" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Tabulações da célula">
<span _ngcontent-c8="" class="oi oi-bookmark"></span>
</button>
</td>
<td _ngcontent-c8="">
<button _ngcontent-c8="" class="btn btn-warning" ngbtooltip="Configurar Pausa" placement="top" type="button" tabindex="0" ng-reflect-router-link="/motivos-pausa,2" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Configurar Pausa">
<span _ngcontent-c8="" class="oi oi-media-pause"></span>
</button>
</td>
</tr><tr _ngcontent-c8="" align="center">
<td _ngcontent-c8="">célula 3</td>
<td _ngcontent-c8="">
<label _ngcontent-c8="" class="switch" ng-reflect-ngb-tooltip="Ativar célula">
<input _ngcontent-c8="" type="checkbox" ng-reflect-model="0" class="ng-untouched ng-pristine ng-valid">
<span _ngcontent-c8="" class="slider round"></span>
</label>
</td>
<td _ngcontent-c8="">
<button _ngcontent-c8="" class="btn btn-primary" ngbtooltip="Alterar célula" placement="top" type="button" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Alterar célula">
<span _ngcontent-c8="" class="oi oi-pencil"></span>
</button>
</td>
<td _ngcontent-c8="">
<button _ngcontent-c8="" class="btn btn-danger" ngbtooltip="Apagar célula" placement="top" type="button" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Apagar célula">
<span _ngcontent-c8="" class="oi oi-trash"></span>
</button>
</td>
<td _ngcontent-c8="">
<button _ngcontent-c8="" class="btn btn-info" ngbtooltip="Configuração de célula" placement="top" type="button" tabindex="0" ng-reflect-router-link="/configuracao-celula" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Configuração de célula">
<span _ngcontent-c8="" class="oi oi-wrench"></span>
</button>
</td>
<td _ngcontent-c8="">
<button _ngcontent-c8="" class="btn btn-secondary" ngbtooltip="Campos da célula" placement="top" type="button" tabindex="0" ng-reflect-router-link="/campos" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Campos da célula">
<span _ngcontent-c8="" class="oi oi-list"></span>
</button>
</td>
<td _ngcontent-c8="">
<button _ngcontent-c8="" class="btn btn-dark" ngbtooltip="Tabulações da célula" placement="top" type="button" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Tabulações da célula">
<span _ngcontent-c8="" class="oi oi-bookmark"></span>
</button>
</td>
<td _ngcontent-c8="">
<button _ngcontent-c8="" class="btn btn-warning" ngbtooltip="Configurar Pausa" placement="top" type="button" tabindex="0" ng-reflect-router-link="/motivos-pausa,57" ng-reflect-placement="top" ng-reflect-ngb-tooltip="Configurar Pausa">
<span _ngcontent-c8="" class="oi oi-media-pause"></span>
</button>
</td>
</tr>
</tbody>
</table>
</div>
解决方案
As per the HTML you have shared it is not clear which element resembles to the round slider icon. To click on the round slider as the element is an Angular element you need to induce WebDriverWait for the element to be clickable and you can use either of the following solution:
driver.findElement(By.Xpath(("//td[contains(.,'célula 1')]//following::td[1]/label//span[@class='slider round']")).click();
//or
driver.findElement(By.Xpath(("//td[contains(.,'célula 1')]//following::td[1]/label/input[@class='ng-untouched ng-pristine ng-valid' and @type='checkbox']")).click();
这篇关于如何单击引用不同元素的按钮?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
