Selenium2(WebDriver)總結(三)---元素定位方法

 元素定位的重要性不言而喻，如果定位不到元素談何操作元素呢，webdrvier提供了很多種元素定位方法，如ID,Name,xpath,css,tagname等。

例如需要定位如下元素：

<input class="input_class" type="text" name="passwd" id="passwd-id" /> 

• By.id：　　　　　　　　WebElement element = driver.findElement(By.id("passwd-id"));

• By.name：　　　　　　WebElement element = driver.findElement(By.name("passwd"));

• By.className 　　　　 WebElement element = driver.findElement(By.className("input_class"));

• By.xpath：　　　　　　WebElement element =driver.findElement(By.xpath("//input[@id='passwd-id']")); 

• By.cssSelector　　　　 WebElement element = driver.findElement(By.cssSelector(".input_class"));

• By.linkText:

　　　　　　//通俗點就是精確查詢

　　　　　　WebDriver driver = new FirefoxDriver();
　　　　　　driver.get("http://www.baidu.com/"); 
　　　　　　WebElement element = driver.findElement(By.linkText("百科"));

• By.partialLinkText：

　　　　　　//這個方法就是模糊查詢
　　　　　　WebDriver driver = new FirefoxDriver();
　　　　　　driver.get("http://www.baidu.com/"); 
　　　　　　WebElement element = driver.findElement(By.partialLinkText("hao"));

• By.tagName:

　　　　　　WebDriver driver = new FirefoxDriver();
　　　　　　driver.get("http://www.baidu.com/");
　　　　　　String test= driver.findElement(By.tagName("form")).getAttribute("name");
　　　　　　System.out.println(test); 

 

在這些定位方法中，除開xpath和css,其它的定位方法都很容易理解和掌握如何使用，下面主要總結下xpath和css定位的一些方法和技巧。

 

一、XPATH

1、xpath和css選擇器在firefox瀏覽器中都可以使用firepath插件來驗證，如下圖，可以選擇xpath或css，然後在後面的輸入框輸入內容進行驗證： 

2、xpath常用符號：

　　/ 　　表示絕對路徑絕對路徑是指從根目錄開始

　　// 　　表示相對路徑

　　. 　　表示當前層

　　.. 　　表示上一層

　　* 　　表示通配符

　　@ 　　表示屬性

　　[] 　　屬性的判斷條件表達式

 3、xpath常用函數：

　　contains ():　　//div[contains(@id,'widget')]，選擇id屬性中包含'widget'的div

　　text():　　　　//a[text()='hello world']，選擇文本值爲'hello world'的節點

　　last():　　　　選擇最後一個

　　starts-with():　　//div[starts-with(@id,'common')] ，選擇id屬性中’common’開頭的div節點　　

　　not():　　　　否定

 PS:具體實例可參考我早先的一篇文章：http://www.cnblogs.com/puresoul/archive/2012/08/22/2651595.html

 4、如果以上還無法定位到元素，我們可以試試用xpath軸：

　　參考：http://www.w3school.com.cn/xpath/xpath_axes.asp 

 

二、CSS

1、css常用符號：

　　#　　表示id

　　.　　表示class

　　>　　表示子元素，層級

　　　　　一個空格也表示子元素，但是是所有的後代子元素，相當於xpath中的相對路徑

 

例子：

<div class="input_class" type="text" name="passwd" id="passwd-id" /> 

　　#input 　　　　　　　　　選擇id爲passwd-id的節點

　　.input_class  　　　　　　選擇class爲input_class的節點

　　div#passwd-id>input 　　選擇id爲passwd-id的div下的所有的input節點

　　div#passwd-id input 　　 選擇id爲passwd-id的div下的所有的input節點

　　div.input_class[name='passwd'] 　　　　選擇class爲input_class並且name爲passwd的節點

　　div[name='passwd'][type='text']　　　　選擇name爲passwd且type爲text的節點