獲得從孩子的CSS元素的特定CSS元素id的值

我使用硒的webdriver包裹在PHPUnit的和香腸來測試一下在停航了類似表中特定行的按鈕：獲得從孩子的CSS元素的特定CSS元素id的值

<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 > span.icon.clickable，其兄弟姐妹.foo與孩子.baz。「其兄弟是.foo和孩子.baz」的要求是我目前可以識別正確元素的唯一方法，因爲同一表中的其他行具有元素#mybutton > span.icon.clickable，並且這些行的ID是動態生成的。

目前我正在使用XPath，但正如您所預料的那樣，FF和IE上的性能是可怕的。是否有從元素tr#id div.bar檢索的tr#id值的方法？如果我能得到這個，我可以使用id來使用CSS來查找我正在尋找的元素。我使用的是PHP，但任何語言的解決方案都是有用的。

或者，更直接的CSS3的解決方案的工作，但相當多的閱讀之後，我所有，但得出的結論是使用標準的CSS3選擇器是不是這種情況下的選擇。以防萬一我遺失了一些東西，是否有CSS3解決方案？我知道有一個CSS4解決方案，但我需要完整的瀏覽器的支持，所以，直到所有的瀏覽器我測試的支持CSS4，我將不得不依靠CSS3。

在此先感謝。

編輯：直到有用於CSS4更好的跨瀏覽器的支持，我需要使用CSS3

來源

2013-08-02 Clandestine

我能想到這樣做是爲了找到By.cssSelector(".foo~span.icon.clickable")和每個元素生成的List<WebElement>的唯一方法span.icon.clickable做findElement(By.cssSelector(".baz"))通過try/catch語句包圍（捕捉NoSuchElementException s）。

如果沒有拋出一個錯誤，那麼你知道你已經找到你的元素。

注：~選擇它，如果它有任何訴訟.foo兄弟姐妹。如果你希望它成爲前一個兄弟，請使用+

來源

2013-08-02 21:30:47

工程很好。對於任何對php解決方案感興趣的人： – Clandestine

對於任何對php解決方案感興趣的人：獲取所有符合條件的元素：'$ elements = $ this-> elements（$ this-> using（'css selector'） - > value （'tr'））;'獲取元素列表中某個元素的某個屬性的值：'$ id = $ elements [0] - > attribute（'tr＃id'）; – Clandestine

有在CSS同級選擇叫~也有一些css4選擇這可能會有幫助。

也許這會工作，如果我理解正確的要求：

#mybutton > .foo ~ span.icon.clickable! > .baz

這應該在Chrome瀏覽器，但其CSS4因此，它可能在很多瀏覽器無法正常工作。

提示：它選擇具有一個孩子.baz

來源

2013-08-02 21:23:02 user1721135

謝謝。我需要一個解決方案，可以與尚未支持css4的瀏覽器一起使用，所以恐怕這對我來說還不適用。我將編輯我的問題以指定css3。 – Clandestine

你可以使用jQuery。 – user1721135

另外@ user1721135，我正在尋找的實際選擇器是'span.icon.clickable'，其父'.mybutton'有一個兄弟'.foo'，子代爲'.baz'。不是那個'.foo的CSS4表達式！ baz〜.mybutton> span.icon.clickable'？ – Clandestine

沒有CSS方法可以選擇它，因爲它需要一個選擇器來查看以前的元素，而這在CSS3中是不可用的。

但是，這在jQuery中會很簡單。選擇具有一類foo

.has(".baz")元素 - - 我爲你的情況

$(".foo").has(".baz").siblings(".mybutton").find("span.icon.clickable").addClass('red');

$(".foo")做出了選擇只返回有一類baz一個兄弟元素。在這種情況下，.foo帶有.baz元素
.siblings(".mybutton") - 查找類別爲mybutton的元素與上一元素處於同一級別。由於我們使用has()代替.foo .baz，這仍然將目標鎖定在.foo元素
.find("span.icon.clickable") - 尋找從先前元素遞減的跨度的icon類和clickable
.addClass('red'); - 只是一個函數來完成的例子

Fiddle

來源

2013-08-02 21:55:06

獲得從孩子的CSS元素的特定CSS元素id的值

回答

相關問題