从子css元素获取特定css元素id的值 [英] Get the value of a particular css element id from child css element

问题描述

我使用 PHPUnit 和 Sausage 包装的 Selenium WebDriver 来测试点击表格中特定行的按钮到：

I am using Selenium WebDriver wrapped in PHPUnit and Sausage to test clicking a button in a specific row in a table that's laid out similar to:

<tr id="dynamically generated 1">
    <td class="foo">
        <div class="bar"></div>
    </td>
    <td class = "mybutton">
        <span class = "icon clickable"></span>
    </td>
</tr>
<tr id="dynamically generated 2">
    <td class="foo">
        <div class="baz"></div>
    </td>
    <td class = "mybutton">
        <span class = "icon clickable"></span>
    </td>
</tr>

特别要点击一个特定的元素 #mybutton>其子集为 .foo 且包含子 .baz 的。其子集为 与子 .baz 的我目前可以识别正确的元素，因为同一个表中的其他行有元素 #mybutton> span.icon.clickable ，并且动态生成这些行的ids。

In particular, I want to click a specific element #mybutton > span.icon.clickable whose sibling is .foo with child .baz. The "whose sibling is .foo with child .baz" requirement is the only way I can currently identify the correct element, as other rows in the same table have element #mybutton > span.icon.clickable, and the ids for those rows are dynamically generated.

目前我使用XPath，期望， FF 和 IE 的性能是可怕的。是否有一种方法从 tr＃id div.bar 元素中检索 tr＃id 的值？如果我可以得到这个，我可以使用id来使用CSS来找到我正在寻找的元素。我使用PHP，但任何语言的解决方案将是有用的。

At the moment I am using XPath, but as you might expect, performance on FF and IE is horrendous. Is there a method for retrieving the value of tr#id from the element tr#id div.bar? If I can get this, I can use the id to use CSS to find the element I am looking for. I am using PHP, but a solution in any language would be useful.

或者，一个更直接的CSS3解决方案可以工作，但经过相当多的阅读后，我得出结论，使用标准的CSS3选择器不是一个选项这个案例。为了万一有一些我缺失，是否有一个CSS3解决方案？我知道有一个CSS4解决方案，但我需要完整的浏览器支持，所以直到所有的浏览器我测试支持CSS4，我将不得不依赖CSS3。

Alternatively, a more straightforward CSS3 solution would work, but after quite a bit of reading, I've all but concluded that using a standard CSS3 selector is not an option for this case. Just in case there is something I'm missing, is there a CSS3 solution for this? I know there is a CSS4 solution, but I need full browser support, so until all the browsers I am testing support CSS4, I'll have to rely on CSS3.

提前感谢。

编辑：在CSS4更好的跨浏览器支持之前，我需要使用CSS3

Until there is better cross-browser support for CSS4, I need to use CSS3

推荐答案

我可以这么想的唯一方法是找到一个 List< WebElement> By.cssSelector（。foo〜span.icon.clickable）并在每个元素上做一个 findElement（By.cssSelector ））由try / catch（捕获 NoSuchElementException s）包围。

The only way I can think to do this is to find a List<WebElement> generated by By.cssSelector(".foo~span.icon.clickable") and on each element do a findElement(By.cssSelector(".baz")) surrounded by try/catch (catching NoSuchElementExceptions).

当没有错误发生时，您就知道您已找到您的元素。

When there isn't an error thrown, then you know that you have found your element.

注意：〜选择它，如果它有任何进行 .foo 兄弟姐妹。如果你想要它是前一个兄弟，使用 +

Note: The ~ selects it if it has ANY proceeding .foo siblings. If you want it to be the immediately previous sibling, use +

这篇关于从子css元素获取特定css元素id的值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！