电竞比分网-中国电竞赛事及体育赛事平台

分享

Selenium Webdriver定位頁面元素的幾種方式

 Go_Ahead 2015-09-15
       對于有點開發(fā)經(jīng)驗的人來說學習這個定位其實相對容易很多,只要你寫過前端js方面的代碼,基本上selenium webdriver的元素定位方式一看就懂,當然也有幾個需要特別注意(如By.xpath/),需要深入的去了解一些,畢竟在實際使用中還是挺頻繁的,下面依照常用->不常用的順序介紹selenium webdriver定位元素的幾種方式:
下圖是通過firebug調試定位到的百度搜索框:
 

1.By.id

2.By.name
同樣,將控件所對應的name屬性找到即可
 
3.By.xpath
這個方法非常重要,會經(jīng)常使用到,使用這種方式幾乎可以定位到任意頁面上的元素。如圖所示,將用xpath(頁面中元素的路徑)來定位我們需要用到的元素
 
 該圖所對應的頁面上的標簽: 
通過路徑來定位控件,分為:絕對路徑、相對路徑(這個概念對應做過開發(fā)的人來說非常熟悉,不錯與我們開發(fā)中的絕對路徑相對路徑非常相似),那么通過selenium webdriver的xpath方式定位元素需要注意:
a.絕對路徑以 "/" 表示,相對路徑以 "//" 表示
-- 當xpath路徑以 "/" 開頭時,表示從頁面的根節(jié)點開始解析;當"/"出現(xiàn)在xpath路徑中時,表示     尋找父節(jié)點的直接子節(jié)點
-- 當xpath路徑以 "//" 開頭時,表示從頁面上任意符合的元素節(jié)點開始解析;當"//"出現(xiàn)在xpath路徑中時,表示尋找父節(jié)點下任意符合條件的子節(jié)點。
弄清楚它們各表示什么意思以后,就可以在實際應用中絕對路徑相對路徑混合使用。
下面是相對路徑引用寫法:
查找頁面根元素://
查找頁面上所有的input元素://input
查找頁面上第一個form元素://form[1]
查找頁面上第一個form元素內的直接input(即第一個input控件)元素://form[1]/input
查找頁面上第一個form元素內所有的input元素(只要在form元素內的input都算,不管嵌套了多少個其它標簽,此時可使用相對路徑"//")://form[1]//input
查找頁面上id為loginForm的form元素://form[@id='loginForm']
查找頁面上id為loginForm的form元素下第一個input元素://form[@id='loginForm']/input
查找頁面上id為loginForm的form元素下第4個input元素://form[@id='loginForm']/input[4]
查找頁面上name屬性為username的input元素://input[@name='username']
查找頁面上name屬性為contiune且type屬性為button的input元素://input[@name='contiune'][@type='button']

4.By.tagName
通過元素的標簽名稱來查找元素.該方法與By.id、By.name不同,通常By.tagName查詢出來的元素不止一個,可能會有多個,所以,使用該方法時會結合findElements來用,如下:
List<WebElement> inputElements = driver.findElements(By.tagName("input"));
for (WebElement input : inputElements) {
if(input.getAttribute("type").equals("text")){
System.out.println(input.getText());
}
}
在頁面中,使用input標簽的有:文本框/單選框/復選框/下拉框/密碼框...,只有type屬性不同

5.By.className
利用元素的css樣式來查找元素.如下頁面代碼,通過className來查找對應的<p>標簽
 WebElement element = driver.findElement(By.className("bmi_info"));
在我學習的過程中,結合tagName,className來獲取BMI的值,如下:
先獲得className為"bmi_info"的<p>元素,該元素內僅有一個span,這時就可以通過tagName獲得該span,代碼如下:
WebElement bmiElement = driver.findElement(By.className("bmi_info")).findElement(By.tagName("span"));
String actualBMI = bmiElement.getText();

6.By.cssSelector

cssSelector這種元素定位方式跟xpath比較類似,但執(zhí)行速度較快,而且各種瀏覽器對它的支持都相當?shù)轿唬怨δ芤彩切U強大的。

下面是一些常見的cssSelector的定位方式:

定位id為flrs的div元素,可以寫成:#flrs     注:相當于xpath語法的//div[@id=’flrs’]

定位id為flrs下的a元素,可以寫成 #flrs > a  注:相當于xpath語法的//div[@id=’flrs’]/a

定位id為flrs下的href屬性值為/forexample/about.html的元素,可以寫成: #flrs > a[href=”/forexample/about.html”]

如果需要指定多個屬性值時,可以逐一加在后面,如#flrs > input[name=”username”][type=”text”]。


7. By.linkText()
通過超文本鏈接上的文字信息來定位元素,這種方式一般專門用于定位頁面上的超文本鏈接
WebElement linkElement = driver.findElement(By.linkText("新聞"));

8.By.partialLinkText()
該方法時By.linkText的擴展,當你不能準確知道超鏈接上的文本信息或者只想通過一些關鍵字進行匹配時,可以使用這個方法來通過部分鏈接文字進行匹配
WebElement linkElement = driver.findElement(By.partialLinkText("新"));













1. 當頁面元素有id屬性時,最好盡量用id來定位。但由于現(xiàn)實項目中很多程序員其實寫的代碼并不規(guī)范,會缺少很多標準屬性,這時就只有選擇其他定位方法。

2. xpath很強悍,但定位性能不是很好,所以還是盡量少用。如果確實少數(shù)元素不好定位,可以選擇xpath或cssSelector。

3. 當要定位一組元素相同元素時,可以考慮用tagName或name。

4. 當有鏈接需要定位時,可以考慮linkText或partialLinkText方式。





 

    轉藏 分享 獻花(0

    0條評論

    發(fā)表

    請遵守用戶 評論公約

    類似文章 更多