了解 WebElement.findElement() 和 XPATH [英] Understanding WebElement.findElement() and XPATH

问题描述

我想使用 WebElement.findElement() API 使用 XPATH //span[@class='child-class'].我认为这会返回父级内部的 <div> .但是，它返回了它在整个 DOM 树中找到的第一个.我是否使用了错误的 XPATH?

我也尝试过使用 .//span[@class='child-class'] 作为 XPATH，但这确实会返回任何内容.

谢谢.

更新:

给定下面的 HTML，我想为子标题 和子日期 定义一个定位器，并使用 WebElement 定位它们.findElement() API 无论父对象是//a/li[1]"还是//a/li[2]"

<li>父母 1<div><span class="child-title child-style">title 1</span><span class="child-date child-style">日期 1<span class="child-author">author 1</span>

</a><a><li>父母 2<div><span class="child-title child-style">title 2</span><span class="child-date child-style">日期 2<span class="child-author">author 3</span>

</a><a><li>家长 3<div><span class="child-title child-style">title 3</span><span class="child-date child-style">日期 3<span class="child-author">author 3</span>

</a>

我有一个 WebElement parent2 使用 "//a/li[2]" 初始化和定位，

WebElement child = parent2.findElement(By.xpath("//span[@class='child-author']")); 会给我author 1"

WebElement child = parent2.findElement(By.xpath("span[@class='child-author']")); 会给我 NoSuchElementException

解决方案

你的示例代码中有我的 2 条评论

1 - 使用您发布的 HTML，找不到 xpath//a/li[2](我们只有 3 个带有//a/li[1] 的元素)

2 - 假设我们有正确的代码，您需要了解 Xpath 中单斜杠和双斜杠的区别

a/b(单斜线):选择具有标签 b"的元素并且紧跟在"具有a 标签"的元素之后

例如:

<b><d><c></c></d></b></a>

和

a//b(双斜线):选择具有标签 b"且是 n 级子元素的元素具有a 标签"的元素

例如:

<c><d><b></b></d></c></a>

所以，用你的代码

<li>父母 1<div><span class="child-title child-style">title 1</span><span class="child-date child-style">日期 1<span class="child-author">author 1</span>

</a>

如果你想获取日期信息，你应该使用

WebElement parent = driver.findElement(By.xpath("//a/li"));WebElement date = parent.findElement(By.xpath("div/span[contains(@class, 'child-date')]"));WebElement date = parent.findElement(By.xpath("//span[contains(@class, 'child-date')]"));

代码

WebElement date = parent.findElement(By.xpath("span[contains(@class, 'child-date')]"));

会带出 NoSuchElementException 因为在 [li] 标签之后没有 [span] 标签

希望有所帮助

I want to use the WebElement.findElement() API to locate a node inside the parent node using XPATH //span[@class='child-class']. I thought this would return me the <div> that is inside the parent. However, it is returning me the first one it found in the entire DOM tree. Did I use the wrong XPATH?

I have also tried using .//span[@class='child-class'] as the XPATH, but that does return anything.

Thank you.

UPDATE:

given the HTML below, I want to define a locator for the child-title <span> and child-date <span> and locate them using WebElement.findElement() API regardless of the parent being "//a/li[1]" or "//a/li[2]"

<a>
    <li> parent 1
        <div>
            <span class="child-title child-style">title 1</span>
            <span class="child-date child-style"> date 1</span>
            <span class="child-author">author 1</span>
        </div>
    </li>
</a>
<a>
    <li> parent 2
        <div>
            <span class="child-title child-style">title 2</span>
            <span class="child-date child-style"> date 2</span>
            <span class="child-author">author 3</span>
        </div>
    </li>
</a>
<a>
    <li> parent 3
        <div>
            <span class="child-title child-style">title 3</span>
            <span class="child-date child-style"> date 3</span>
            <span class="child-author">author 3</span>
        </div>
    </li>
</a>

I have a WebElement parent2 initialized and located using "//a/li[2]",

WebElement child = parent2.findElement(By.xpath("//span[@class='child-author']")); would give me "author 1"

WebElement child = parent2.findElement(By.xpath("span[@class='child-author']")); would give me NoSuchElementException

解决方案

There are my 2 comments with your sample code

1 - With your posted HTML, the xpath //a/li[2] is not found (we only have 3 elements with //a/li[1])

2 - Assume that we do have right code, you need to understand the differences between single slash and double slash in Xpath

a/b (single slash): select element that has "tag b" and "stands right after" an element that has "a tag" 

E.g.:

<a>
    <b>
          <d>
               <c>
               </c>
          </d>
    </b>
</a>

AND

a//b (double slash): select element that has "tag b" and is n-level-child an element that has "a tag"

E.g.:

<a>
    <c>
          <d>
               <b>
               </b>
          </d>
    </c>
</a>

So, with your code

<a>
<li> parent 1
    <div>
        <span class="child-title child-style">title 1</span>
        <span class="child-date child-style"> date 1</span>
        <span class="child-author">author 1</span>
    </div>
</li>
</a>

If you want to get Date Info, you should use

WebElement parent = driver.findElement(By.xpath("//a/li"));
WebElement date = parent.findElement(By.xpath("div/span[contains(@class, 'child-date')]"));
WebElement date = parent.findElement(By.xpath("//span[contains(@class, 'child-date')]"));

The code

WebElement date = parent.findElement(By.xpath("span[contains(@class, 'child-date')]"));

Will bring out NoSuchElementException because there is no [span] tag right after [li] tag

Hope help

这篇关于了解 WebElement.findElement() 和 XPATH的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！