Finding WebElement Relative to Another WebElement

Question

I'm trying to find a webelement relative to another webelement that's not a child to the other using Selenium. Here is a snippet of the source I'm working with ...

<td class="action" rowspan="7">
    <table class="action">
        <tbody>
            <tr class="topTr topTrPlainBg">
            <tr>
                <td class="middleLeftPlainBg" style="width: 4px;">
                <td class="caption" style="width: 99%; height: 215px;" colspan="4" title="Action properties">
                    <a href="javascript: var none=0;">Foo bar</a>
                </td>
                <td class="middleRightPlainBg" style="width: 4px;">
            </tr>
            <tr class="bottomTr bottomTrPlainBg">
        </tbody>
    </table>
</td>
<td class="rule rulePlainBg" colspan="1">
    <table class="rule rulePlainBg">
        <tbody>
            <tr>
                <td class="captionRule">Successful</td>
                <td class="plus">
                    <img src="https://mcc-69-77.usae.bah.com/sam/admin/vpe2/public/img/vpe-old/rule/plus-over.gif" title="Add item"/>
                </td>
                <td class="swap">
            </tr>
        </tbody>
    </table>
</td>

I'm trying to find the img element with the title "Add item" relative to the a element with the value of "Foo bar". I know the element I'm looking for is going to be a child of the td immediately following the td that's the parent of the relative element. Here's what I have so far (in Java) ...

WebElement fooBar = driver.findElement(By.linkText("Foo bar"));
fooBar.findElement(By.xpath("..//..//..//..//../td//img[@title='Add item']")).click();

Any ideas what I'm doing wrong here? I've tried playing around with the slashes a bit but can't get anything to work.

Answer 1

What if you change the strategy a bit and use following-sibling :

//td[@class="action" and .//td[@class="caption"]/a[. = "Foo Bar"]]/following-sibling::td[contains(@class, "rule")]//td[@class="plus"]/img[@title="Add item"]

In selenium:

WebElement addItem = driver.findElement(By.xpath("//td[@class='action' and .//td[@class='caption']/a[. = 'Foo Bar']]/following-sibling::td[contains(@class, 'rule')]//td[@class='plus']/img[@title='Add item']"));
addItem.click();

Here we are getting the a element with Foo Bar text checking parent's classes on the way. Then, for the first td parent getting the following td sibling with rule class. Then, getting the desired img element.

And if you want to start from the found a element, use ancestor to find the td parent with class="action" and then apply the following sibling check:

ancestor::td[@class="action"]/following-sibling::td[contains(@class, "rule")]//td[@class="plus"]/img[@title="Add item"]

In selenium:

WebElement fooBar = driver.findElement(By.linkText("Foo bar"));
fooBar.findElement(By.xpath("ancestor::td[@class='action']/following-sibling::td[contains(@class, 'rule')]//td[@class='plus']/img[@title='Add item']")).click();

Answer 2

查看您正在使用的xpath ，我看到的是您缺少初始值//因此请替换您正在使用的xpath

//..//..//..//..//../td//img[@title='Add item']