定位页面元素-方法汇总

http://sariyalee.iteye.com/blog/1697856

webdriver提供了强大的元素定位方法，支持以下三种方法。

单个对象的定位方法

多个对象的定位方法

层级定位

注意：

selenium-webdriver通过findElement()\findElements()等find方法调用"By"对象来定位和查询元素。By类只是提供查询的方式进行分类。findElement返回一个元素对象否则抛出异常，findElements返回符合条件的元素 List，如果不存在符合条件的就返回一个空的list。
1.定位单个对象

webdriver使用了以下方法定位元素：

       * By.className(className))   

       * By.cssSelector(selector)      

       * By.id(id)                    

       * By.linkText(linkText)         

       * By.name(name)            

       * By.partialLinkText(linkText)

       * By.tagName(name)      

       * By.xpath(xpathExpression)
1）使用className定位元素

定位的html文件：

Html代码  


<form action="/s" name="f">  
<span class="s_ipt_wr">  
<input type="text" class="s_ipt" maxlength="100" id="kw" name="wd" autocomplete="off">  
</span>  
<input type="hidden" value="0" name="rsv_bp"><input type="hidden" value="3" name="rsv_spt">  
<span class="s_btn_wr">  
<input type="submit" onmouseout="this.className='s_btn'" onmousedown="this.className='s_btn s_btn_h'" class="s_btn" id="su" value="百度一下">  
</span>  
<div id="sd_1350115810720" style="display: none;"></div>  
</form>  

Java代码  


package selenium.test.googleSearch;  
  
import org.openqa.selenium.By;  
import org.openqa.selenium.WebDriver;  
import org.openqa.selenium.WebElement;  
import org.openqa.selenium.firefox.*;  
public class BaiduFirefoxDriver {  
  
    /** 
     * @param args 
     */  
    public static void main(String[] args) {  
        // TODO Auto-generated method stub   
        System.setProperty("webdriver.firefox.bin", "D:\\Program Files\\Mozilla Firefox\\firefox.exe");   
        WebDriver driver = new FirefoxDriver();  
        //页面跳转  
        driver.get("http://www.baidu.com/");  
        //根据className定位百度查询输入框  
        WebElement search=driver.findElement(By.className("s_ipt"));  
        //输入查询条件classname  
        search.sendKeys("classname");  
    }  
  
}  

2）使用cssSelector定位元素

定位的html文件：

Html代码  


<form action="/s" name="f">  
<span class="s_ipt_wr">  
<input type="text" class="s_ipt" maxlength="100" id="kw" name="wd" autocomplete="off">  
</span>  
<input type="hidden" value="0" name="rsv_bp"><input type="hidden" value="3" name="rsv_spt">  
<span class="s_btn_wr">  
<input type="submit" onmouseout="this.className='s_btn'" onmousedown="this.className='s_btn s_btn_h'" class="s_btn" id="su" value="百度一下">  
</span>  
<div id="sd_1350115810720" style="display: none;"></div>  
</form>  

Java代码  


package selenium.test.googleSearch;  
  
import org.openqa.selenium.By;  
import org.openqa.selenium.WebDriver;  
import org.openqa.selenium.WebElement;  
import org.openqa.selenium.firefox.*;  
public class BaiduFirefoxDriver {  
  
    /** 
     * @param args 
     */  
    public static void main(String[] args) {  
        // TODO Auto-generated method stub   
        System.setProperty("webdriver.firefox.bin", "D:\\Program Files\\Mozilla Firefox\\firefox.exe");   
        WebDriver driver = new FirefoxDriver();  
        //页面跳转  
        driver.get("http://www.baidu.com/");  
        //根据classSelector定位百度查询输入框  
        WebElement search=driver.findElement(By.cssSelector("#kw"));  
        //输入查询条件classname  
        search.sendKeys("classname");  
    }  
  
}  

3）使用id定位元素

定位的html文件：

Html代码  


<form action="/s" name="f">  
<span class="s_ipt_wr">  
<input type="text" class="s_ipt" maxlength="100" id="kw" name="wd" autocomplete="off">  
</span>  
<input type="hidden" value="0" name="rsv_bp"><input type="hidden" value="3" name="rsv_spt">  
<span class="s_btn_wr">  
<input type="submit" onmouseout="this.className='s_btn'" onmousedown="this.className='s_btn s_btn_h'" class="s_btn" id="su" value="百度一下">  
</span>  
<div id="sd_1350115810720" style="display: none;"></div>  
</form>  

Java代码  


package selenium.test.googleSearch;  
  
import org.openqa.selenium.By;  
import org.openqa.selenium.WebDriver;  
import org.openqa.selenium.WebElement;  
import org.openqa.selenium.firefox.*;  
public class BaiduFirefoxDriver {  
  
    /** 
     * @param args 
     */  
    public static void main(String[] args) {  
        // TODO Auto-generated method stub   
        System.setProperty("webdriver.firefox.bin", "D:\\Program Files\\Mozilla Firefox\\firefox.exe");   
        WebDriver driver = new FirefoxDriver();  
        //页面跳转  
        driver.get("http://www.baidu.com/");  
        //根据id定位百度查询输入框  
        WebElement search=driver.findElement(By.id("kw"));  
        //输入查询条件classname  
        search.sendKeys("classname");  
    }  
  
}  

4）使用name定位元素

定位的html文件：

Html代码  


<form action="/s" name="f">  
<span class="s_ipt_wr">  
<input type="text" class="s_ipt" maxlength="100" id="kw" name="wd" autocomplete="off">  
</span>  
<input type="hidden" value="0" name="rsv_bp"><input type="hidden" value="3" name="rsv_spt">  
<span class="s_btn_wr">  
<input type="submit" onmouseout="this.className='s_btn'" onmousedown="this.className='s_btn s_btn_h'" class="s_btn" id="su" value="百度一下">  
</span>  
<div id="sd_1350115810720" style="display: none;"></div>  
</form>  

Java代码  


package selenium.test.googleSearch;  
  
import org.openqa.selenium.By;  
import org.openqa.selenium.WebDriver;  
import org.openqa.selenium.WebElement;  
import org.openqa.selenium.firefox.*;  
public class BaiduFirefoxDriver {  
  
    /** 
     * @param args 
     */  
    public static void main(String[] args) {  
        // TODO Auto-generated method stub   
        System.setProperty("webdriver.firefox.bin", "D:\\Program Files\\Mozilla Firefox\\firefox.exe");   
        WebDriver driver = new FirefoxDriver();  
        //页面跳转  
        driver.get("http://www.baidu.com/");  
        //根据name定位百度查询输入框  
        WebElement search=driver.findElement(By.name("wd"));  
        //输入查询条件classname  
        search.sendKeys("classname");  
    }  
  
}  

5）使用tagname定位元素

定位的html文件：

Html代码  


<form action="/s" name="f">  
<span class="s_ipt_wr">  
<input type="text" class="s_ipt" maxlength="100" id="kw" name="wd" autocomplete="off">  
</span>  
<input type="hidden" value="0" name="rsv_bp"><input type="hidden" value="3" name="rsv_spt">  
<span class="s_btn_wr">  
<input type="submit" onmouseout="this.className='s_btn'" onmousedown="this.className='s_btn s_btn_h'" class="s_btn" id="su" value="百度一下">  
</span>  
<div id="sd_1350115810720" style="display: none;"></div>  
</form>  

Java代码  


package selenium.test.googleSearch;  
  
import org.openqa.selenium.By;  
import org.openqa.selenium.WebDriver;  
import org.openqa.selenium.WebElement;  
import org.openqa.selenium.firefox.*;  
public class BaiduFirefoxDriver {  
  
    /** 
     * @param args 
     */  
    public static void main(String[] args) {  
        // TODO Auto-generated method stub   
        System.setProperty("webdriver.firefox.bin", "D:\\Program Files\\Mozilla Firefox\\firefox.exe");   
        WebDriver driver = new FirefoxDriver();  
        //页面跳转  
        driver.get("http://www.baidu.com/");  
        //根据tagName定位百度查询输入框  
        WebElement search=driver.findElement(By.tagName("input"));  
        //输入查询条件classname  
        search.sendKeys("classname");  
    }  
  
}  

6）使用xpath定位元素

定位的html文件：

Html代码  


<form action="/s" name="f">  
<span class="s_ipt_wr">  
<input type="text" class="s_ipt" maxlength="100" id="kw" name="wd" autocomplete="off">  
</span>  
<input type="hidden" value="0" name="rsv_bp"><input type="hidden" value="3" name="rsv_spt">  
<span class="s_btn_wr">  
<input type="submit" onmouseout="this.className='s_btn'" onmousedown="this.className='s_btn s_btn_h'" class="s_btn" id="su" value="百度一下">  
</span>  
<div id="sd_1350115810720" style="display: none;"></div>  
</form>  

Java代码  


package selenium.test.googleSearch;  
  
import org.openqa.selenium.By;  
import org.openqa.selenium.WebDriver;  
import org.openqa.selenium.WebElement;  
import org.openqa.selenium.firefox.*;  
public class BaiduFirefoxDriver {  
  
    /** 
     * @param args 
     */  
    public static void main(String[] args) {  
        // TODO Auto-generated method stub   
        System.setProperty("webdriver.firefox.bin", "D:\\Program Files\\Mozilla Firefox\\firefox.exe");   
        WebDriver driver = new FirefoxDriver();  
        //页面跳转  
        driver.get("http://www.baidu.com/");  
        //根据xpath定位百度查询输入框  
        WebElement search=driver.findElement(By.xpath("//*[@id='kw']"));  
        //输入查询条件classname  
        search.sendKeys("classname");  
    }  
  
}  

7）使用linkText定位元素

定位的html文件：

Html代码  


<a href="http://baike.baidu.com" name="tj_baike">百科</a>  

Java代码  


package selenium.test.googleSearch;  
  
import org.openqa.selenium.By;  
import org.openqa.selenium.WebDriver;  
import org.openqa.selenium.WebElement;  
import org.openqa.selenium.firefox.*;  
public class BaiduFirefoxDriver {  
  
    /** 
     * @param args 
     */  
    public static void main(String[] args) {  
        // TODO Auto-generated method stub   
        System.setProperty("webdriver.firefox.bin", "D:\\Program Files\\Mozilla Firefox\\firefox.exe");   
        WebDriver driver = new FirefoxDriver();  
        //页面跳转  
        driver.get("http://www.baidu.com/");  
        //根据linkText定位  
        WebElement link=driver.findElement(By.linkText("百科"));  
        link.click();  
    }  
  
}  

8）使用partialLinkText定位元素

定位的html文件：

Html代码  


<a href="http://baike.baidu.com" name="tj_baike">百科</a>  

Java代码  


package selenium.test.googleSearch;  
  
import org.openqa.selenium.By;  
import org.openqa.selenium.WebDriver;  
import org.openqa.selenium.WebElement;  
import org.openqa.selenium.firefox.*;  
public class BaiduFirefoxDriver {  
  
    /** 
     * @param args 
     */  
    public static void main(String[] args) {  
        // TODO Auto-generated method stub   
        System.setProperty("webdriver.firefox.bin", "D:\\Program Files\\Mozilla Firefox\\firefox.exe");   
        WebDriver driver = new FirefoxDriver();  
        //页面跳转  
        driver.get("http://www.baidu.com/");  
        //根据linkText定位  
        WebElement link=driver.findElement(By.linkText("科"));  
        link.click();  
    }  
  
}  

2.定位多个对象

Java代码  


package selenium.test.googleSearch;  
  
import java.util.List;  
  
import org.openqa.selenium.By;  
import org.openqa.selenium.WebDriver;  
import org.openqa.selenium.WebElement;  
import org.openqa.selenium.firefox.*;  
public class BaiduFirefoxDriver {  
  
    /** 
     * @param args 
     */  
    public static void main(String[] args) {  
        // TODO Auto-generated method stub   
        System.setProperty("webdriver.firefox.bin", "D:\\Program Files\\Mozilla Firefox\\firefox.exe");   
        WebDriver driver = new FirefoxDriver();  
        //页面跳转  
        driver.get("http://www.baidu.com/");  
        //定位百度快捷功能链接，并返回其值  
        List<WebElement> links=driver.findElements(By.id("nv"));  
        for(WebElement e:links){  
            System.out.println(e.getText());  
        }  
    }  
  
}  

其输出结果为：

Java代码  


新 闻　网 页　贴 吧　知 道　MP3　图 片　视 频　地 图  

3.层级定位

层级定位的思想是先定位父元素，然后再从父元素中精确定位出其我们需要选取的子元素。

层级定位一般的应用场景是无法直接定位到需要选取的元素，但是其父元素比较容易定位，通过定位父元素再遍历其子元素选择需要的目标元素，或者需要定位某个元素下所有的子元素。

定位的html文件：

Html代码  


<p id="nv">  
<a href="http://news.baidu.com" name="tj_news">新 闻</a>  
<b>网 页</b>  
<a href="http://tieba.baidu.com" name="tj_tieba">贴 吧</a>  
<a href="http://zhidao.baidu.com" name="tj_zhidao">知 道</a>  
<a href="http://mp3.baidu.com" name="tj_mp3">MP3</a>  
<a href="http://image.baidu.com" name="tj_img">图 片</a>  
<a href="http://video.baidu.com" name="tj_video">视 频</a>  
<a href="http://map.baidu.com" name="tj_map">地 图</a>  
</p>  

Java代码  


package selenium.test.googleSearch;  
  
import java.util.List;  
  
import org.openqa.selenium.By;  
import org.openqa.selenium.WebDriver;  
import org.openqa.selenium.WebElement;  
import org.openqa.selenium.firefox.*;  
public class BaiduFirefoxDriver {  
  
    /** 
     * @param args 
     */  
    public static void main(String[] args) {  
        // TODO Auto-generated method stub   
        System.setProperty("webdriver.firefox.bin", "D:\\Program Files\\Mozilla Firefox\\firefox.exe");   
        WebDriver driver = new FirefoxDriver();  
        //页面跳转  
        driver.get("http://www.baidu.com/");  
        //先定位父元素nv  
        WebElement p=driver.findElement(By.id("nv"));  
        //再根据父元素定位子元素  
        WebElement link=p.findElement(By.name("tj_zhidao"));  
        //打印子元素的link值  
        System.out.println(link.getText());  
          
    }  
  
}  

输出结果为：

Java代码  


知 道