如何定位嵌套的跨度元素定位器答案

【问题标题】：how to locate the nested span element locator如何定位嵌套的跨度元素定位器
【发布时间】：2017-09-14 15:34:54
【问题描述】：

如何仅定位包含以下代码中价格值的父跨度，定位器策略无关紧要：

<div class="price-box price-margin">
    <p class="old-price"></p>
    <p class="special-price">
        <span id="product-price-75254" class="price">
                              56,90 € 
             <span class="steuerstern">*</span>
        </span>
    </p>
</div>

【问题讨论】：

//span[contains(., "56,90 €")] ?
该跨度的价格和id值不固定，会根据产品选择而变化，需要是跨度的通用定位器
//p[@class="special-price"]/span[@class="price"]
这将包括子跨度类（），我不想考虑这一点，只是想检索价格（56,90 欧元）而不是（56,90 欧元）我>。您提供的定位器给了我 (56,90 €)*

标签： selenium xpath css-selectors

【解决方案1】：

问题不在于这里的选择器。但是文本功能。

//p[@class="special-price"]/span[@class="price"]

这将选择节点，但 selenium 也将始终返回子节点的节点。在这种情况下，您正在寻找的是节点文本。这只能使用 JavaScript 来完成。既然你没有提到一种语言，我将假设 python

elem = driver.find_element_by_xpath('//p[@class="special-price"]/span[@class="price"]')

price = driver.execute_script("return arguments[0].firstChild.textContent.trim();", elem)

print(price)
56,90 €

【讨论】：

【解决方案2】：

使用选择器可以这样：

".price-box span.price"

结果：

56,90 €

【讨论】：

【解决方案3】：

要在 Chrome 中测试 xpath 的正确性，您可以使用

//span[@class="price"]/text()

由于你没有提到你使用的语言，这里有一个使用 .getText() 在 nightwatchjs 中使用 selenium 的示例

.getText() 是返回一个对象，实际的文本是回调的值。

var thetext='';
.getText('//span[@class="price"]' ,fucntion(result){
    thetext=result.value();
 })

【讨论】：

【解决方案4】：

由于您没有提到您正在使用的Selenium 绑定，所以我将通过Java 绑定构造一个答案。这里我们将使用自定义的xpath 来定位文本为56,90 € 而没有* 的节点，如下所示：

WebElement ele = driver.findElement(By.xpath("//p[@class='special-price']/span[contains(@class,'price') and not(@class='steuerstern')]"));

【讨论】：