使用cssSelector选择嵌套元素使用cssSelector - Selenium WebDriver

Question

我想根据文本选择一个元素。我遇到的问题是元素文本在源代码中存在多次。我使用xpath来找到它（尽管我试图避免xpath），但这就是我能够工作的一切。

下面是我对工作的HTML：

<ul id="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage" class="cbl centered d2" style="width:511px;"> 
    <li> 
     <input id="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage_0" name="ctl00$ctl00$Dialogs$Dialogs$ctlAcknowledgeMessage_ConditionalDecline$cblMessage$0" onclick="CannedCommentSelected(this);" value="Complexity of job requires extra charge" type="checkbox"> 
     <label for="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage_0">Complexity of job requires extra charge</label> 
    </li> 
    <li> 
     <input id="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage_1" name="ctl00$ctl00$Dialogs$Dialogs$ctlAcknowledgeMessage_ConditionalDecline$cblMessage$1" onclick="CannedCommentSelected(this);" value="Complexity of job requires extra time" type="checkbox"> 
     <label for="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage_1">Complexity of job requires extra time</label> 
    </li> 
    <li> 
     <input id="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage_2" name="ctl00$ctl00$Dialogs$Dialogs$ctlAcknowledgeMessage_ConditionalDecline$cblMessage$2" onclick="CannedCommentSelected(this);" value="Current workload requires extra time" type="checkbox"> 
     <label for="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage_2">Current workload requires extra time</label> 
    </li> 
    <li> 
     <input id="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage_3" name="ctl00$ctl00$Dialogs$Dialogs$ctlAcknowledgeMessage_ConditionalDecline$cblMessage$3" onclick="CannedCommentSelected(this);" value="Distance to property requires extra charge" type="checkbox"> 
     <label for="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage_3">Distance to property requires extra charge</label> 
    </li> 
</ul> 

我用driver.findElement(By.xpath("//label[contains(text(), 'Complexity of job requires extra charge')]"));，但我开始“元素当前不可见，因此可能无法与之交互”的错误，害得我发现有“工作的复杂性需要额外费用”文本的多个标签。我试过driver.findElement(By.cssSelector("#Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage > #Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage_0 > label[text='Complexity of job requires extra charge']"));，但它试图找到元素超时。

我在做什么错？

我甚至试过driver.findElement(By.cssSelector("#Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage > input[value='Complexity of job requires extra charge']"));，我肯定会工作，但它超时寻找。

Answer 1

在这种情况下，你应该尝试使用JavascriptExecutor与此如下交互： -

WebElement el = driver.findElement(By.cssSelector("input[value='Complexity of job requires extra charge']")); 

((JavascriptExecutor) driver).executeScript("arguments[0].click();",el); 

编辑： -

List<WebElement> els = driver.findElements(By.cssSelector("input[value='Complexity of job requires extra charge']")); 
for(WebElement el : els) 
{ 
    if(el.isDisplayed() && el.isEnabled()) 
    { 
    el.click(); 
    } 
} 

希望它能帮助... :)

Answer 2

你的CSS没有工作，因为它试图找到标签作为输入的孩子，这真的是兄弟姐妹。你可以告诉xpath通过ID查找父母ul。以下XPath应工作：

//ul[@id="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage"]/li/label[contains(text(), 'Complexity of job requires extra charge')] 

，如果你在选择输入，这样就可以检查框真正感兴趣的，试试这个：

//ul[@id="Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage"]/li/label[contains(text(), 'Complexity of job requires extra charge')]/preceding-sibling::input 

Answer 3

你有两个问题cssSelector：

>用于直接孩子，但ID与cblMessage和cblMessage_0结束元素具有与ID与cblMessage_0和结束元素之间的另一个元素，你正在寻找的元素是兄弟姐妹。

您可以使用此cssSelector与文本

driver.findElement(By.cssSelector("#Dialogs_Dialogs_ctlAcknowledgeMessage_ConditionalDecline_cblMessage_0 ~ label")); 

~代表兄弟来定位的元素。