java selenium (五) 元素定位大全

頁面元素定位是自動化中最重要的事情， selenium Webdriver 提供了很多種元素定位的方法。  測試人員應該熟練掌握各種定位方法。 使用最簡單，最穩定的定位方法。

 

閱讀目錄

 

自動化測試步驟

在自動化測試過程中， 測試程序通常的操作頁面元素步驟

1. 找到Web的頁面元素，並賦予到一個存儲對象中 (WebElement)

2. 對存儲頁面元素的對象進行操作， 例如：點擊鏈接，在輸入框中輸入字符等

3. 驗證頁面上的元素是否符合預期

 

通過這三個步驟， 我們可以完成一個頁面元素的操作， 找到頁面元素是很重要的一個步驟。 找不到頁面元素，后面就沒法做了

Web頁面技術的現實復雜性， 造成大量的頁面元素很難定位。  經常有人不知道怎么定位。

 

定位方法大全

 

使用WebDriver對象的findElement函數定義一個Web頁面元素

使用findElements函數可以定位頁面的多個元素

定位的頁面元素需要使用WebElement對象來存儲，以便后續使用

 

常用的定位頁面元素方法如下，   按推薦排序

 

定位方法	Java語言實現實例
id 定位	driver.findElement(By.id(“id的值”))；
name定位	driver.findElement(By.name(“name的值”))；
鏈接的全部文字定位	driver.findElement(By.linkText(“鏈接的全部文字”))；
鏈接的部分文字定位	driver.findElement(By.partialLinkText(“鏈接的部分文字”))；
css 方式定位	driver.findElement(By.cssSelector(“css表達式”))；
xpath 方式定位	driver.findElement(By.xpath(“xpath表達式”))；
Class 名稱定位	driver.findElement(By.className(“class屬性”))；
TagName 標簽名稱定位	driver.findElement(By.tagName(“標簽名稱”))；
Jquery方式	Js.executeScript(“return jQuery.find(“jquery表達式”)”)

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

如何定位

在使用selenium webdriver進行元素定位時,通常使用findElement或findElements方法結合By類返回元素句柄來定位元素

findElement() 方法返回一個元素, 如果沒有找到,會拋出一個異常 NoElementFindException()

findElements()方法返回多個元素, 如果沒有找到,會返回空數組, 不會拋出異常

 

如何選擇 定位方法

策略是， 選擇簡單，穩定的定位方法。

1. 當頁面元素有id屬性的時候， 盡量使用id來定位。  沒有的話，再選擇其他定位方法

2. cssSelector  執行速度快， 推薦使用

3. 定位超鏈接的時候，可以考慮linkText或partialLinkText：　但是要注意的是 ，  文本經常發生改變，　所以不推薦用

3. xpath 功能最強悍。 當時執行速度慢，因為需要查找整個DOM,  所以盡量少用。  實在沒有辦法的時候，才使用xpath 

 

 

通過ID查找元素: By.id()

通過頁面元素的ID來查找元素是最為推薦的方式, W3C標准推薦開發人員為每一個頁面元素都提供獨一無二的ID屬性

一旦元素被賦予了唯一的ID屬性.,  我們做自動化測試的時候,很容易定位到元素.  元素的ID被作為首選的識別屬性, 因為是最快的識別策略.

 

以百度主頁為例,  搜索框的HTML示例代碼如下,   它的ID為kw

<input type="text" autocomplete="off" maxlength="100" id="kw" name="wd" class="s_ipt">

"百度一下"搜索按鈕元素的HTML示例代碼如下,   它ID為su

<input type="submit" class="btn self-btn bg s_btn" id="su" value="百度一下">

在Selenium/WebDriver 中通過ID查找元素的Java示例代碼如下

        WebDriver driver  = new FirefoxDriver();
        driver.get("http://www.baidu.com");
         
        WebElement searchBox = driver.findElement(By.id("kw"));
        searchBox.sendKeys("小坦克 博客園");
        WebElement searchButton = driver.findElement(By.id("su"));
        searchButton.submit();
        
        driver.close();

 

通過Name查找元素:By.name()

以豆瓣網的主頁搜索框為例, 其搜索框的HTML代碼如下,  它name是: q

<input type="text" autocomplete="off" name="q" placeholder="書籍、電影、音樂、小組、小站、成員" size="12" maxlength="60">

WebDriver中通過name查找豆瓣主頁上的搜索框的Java代碼如下:

        WebDriver driver  = new FirefoxDriver();
        driver.get("http://www.douban.com");
         
        WebElement searchBox = driver.findElement(By.name("q"));
        searchBox.sendKeys("小坦克");
        searchBox.submit();

 

 

通過TagName查找元素: By.tagName()

通過tagName來搜索元素的時候,會返回多個元素. 因此需要使用findElements()

        WebDriver driver  = new FirefoxDriver();
        driver.get("http://www.cnblogs.com");
         
        List<WebElement> buttons = driver.findElements(By.tagName("div"));
        System.out.println("Button:" + buttons.size());

注意:  如果使用tagName,  要注意很多HTML元素的tagName是相同的,

比如單選框,復選框, 文本框,密碼框.這些元素標簽都是input.  此時單靠tagName無法精確獲取我們想要的元素, 還需要結合type屬性,才能過濾出我們要的元素

        WebDriver driver  = new FirefoxDriver();
        driver.get("http://www.cnblogs.com");
         
        List<WebElement> buttons = driver.findElements(By.tagName("input"));
        for (WebElement webElement : buttons) {
            if (webElement.getAttribute("type").equals("text")) {
                System.out.println("input text is :" + webElement.getText());
            }
        }

 

通過ClassName 查找元素 By.className

 

以淘寶網的主頁搜索為例， 其搜索框的HTML代碼如下:   class="search-combobox-input"

<input autocomplete="off" autofocus="true" accesskey="s" aria-label="請輸入搜索文字" name="q" id="q" class="search-combobox-input" aria-haspopup="true" aria-combobox="list" role="combobox" x-webkit-grammar="builtin:translate" tabindex="0">

 

Java 示例代碼如下

        WebDriver driver  = new FirefoxDriver();
        driver.get("http://www.taobao.com");
        Thread.sleep(15000);
        WebElement searchBox = driver.findElement(By.className("search-combobox-input"));

        searchBox.sendKeys("羽絨服");
        searchBox.submit();

注意：使用className 來進行元素定位時， 有時會碰到一個

 

通過LinkText查找元素 By.linkText();

 直接通過超鏈接上的文字信息來定位元素：例如

<a href="https://passport.baidu.com/v2/?login&amp;tpl=mn&amp;u=http%3A%2F%2Fwww.baidu.com%2F" name="tj_login" class="lb" onclick="return false;">登錄</a>

 

HTML 代碼如下

        WebDriver driver  = new FirefoxDriver();
        driver.get("http://www.baidu.com");
        WebElement loginLink = driver.findElement(By.linkText("登錄"));
        loginLink.click();

 

 

通過PartialLinkText 查找元素　By.partialLinkText()

此方法是上一個方法的加強版，　單你只想用一些關鍵字匹配的時候，可以使用這個方法，通過部分超鏈接文字來定位元素

HTML 代碼如下

        WebDriver driver  = new FirefoxDriver();
        driver.get("http://www.baidu.com");
        WebElement loginLink = driver.findElement(By.partialLinkText("登"));
        loginLink.click();

注意：用這種方法定位時，　可能會引起的問題是，　當你的頁面中不知一個超鏈接包含“等”時，　findElement方法只會返回第一個查找到的元素，而不會返回所有符合條件的元素

如果你想要獲得所有符合條件的元素，還是只能用findElements方法

 

通過CSS選擇器查找元素、

 請看 java selenium (七) CSS 定位

通過Xpath 查找元素

 請看 java selenium (六) XPath 定位