WebElement。findElement找不到子元素

Question

我试图从html代码中获取子元素（卡号），其中html标记和类名相同。下面是html代码片段

<li class="paymentMethods-stored">  
    <li class="paymentMethod">
        <div class="stored-card-details">
            <span class="body-2">Name: </span>
            <span class="body-2 body-2-md"> VISA</span>
        <p>
            <span class="body-2">Number:</span>
            <span class="body-2 body-2-md"> ************4305</span>
        </p>
        <p>
            <span class="body-2">Expiry:</span>
            <span class="body-2 body-2-md"> 03/2030</span>
        </p>
        </div>
    </li>
    <li class="paymentMethod">
        <div class="stored-card-details">
            <span class="body-2">Name: </span>
            <span class="body-2 body-2-md"> VISA</span>
        <p>
            <span class="body-2">Number:</span>
            <span class="body-2 body-2-md"> ************4111</span>
        </p>
        <p>
            <span class="body-2">Expiry:</span>
            <span class="body-2 body-2-md"> 04/2031</span>
        </p>
        </div>
    </li>
</li>

下面是我尝试的标识符。但都返回了第一个卡号 "************4305”。

@FindBy(xpath = "//li[@class='paymentMethods-stored']//li[@class='paymentMethod']")
private WebElement firstSavedCard;
        
@FindBy(xpath = "(//li[@class='paymentMethods-stored']//li[@class='paymentMethod'])[2]")
private WebElement secondSavedCard; 
        
String firstCard=firstSavedCard.findElement(By.xpath("//*[@class='stored-card-details']/p[1]/span[2]")).getText();
String secondCard=secondSavedCard.findElement(By.xpath("//*[@class='stored-card-details']/p[1]/span[2]")).getText();

        

尝试了其他选项：这也返回了第一个卡号“************4305”。

secondSavedCard.findElement(By.xpath("/p[1]/span[2]")).getText();
secondSavedCard.findElement(By.xpath(".//*[@class='stored-card-details']/p[1]/span[2]")).getText()

Answer 1

尝试下面的xpath选择所有编号的标签-

//li[@class="paymentMethod"]/descendant::span[4]

用于选择第一个元素使用-

(//li[@class="paymentMethod"]/descendant::span[4])[1]

用于选择第二个元素使用-

(//li[@class="paymentMethod"]/descendant::span[4])[2]

等等。

此外，您可以使用findelements而不是findelement来查找所有元素。收集列表中的所有元素，然后遍历并提取文本。