一、简单元素定位
学习了元素的定位方法和元素的操作之后,下面就来练习一下,下面是html的源码
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
<title>test</title>
<script language="javaScript">
function toAlert() {
alert("hello continue...");
}
</script>
</head>
<body>
<div id="firstdiv">
<form>
<div>第一个div</div>
<div>第二个div</div>
<div>第三个div</div>
<table>
<tr>
<td>
username:
<input name="account" class="user" id="accountID" type="text" value=""/>
</td>
</tr>
<tr>
<td>
password:
<input name="password" id="passwordID" type="password" value=""/>
</td>
</tr>
<tr>
<td>地区:
<select class="u17" id="areaID">
<option value="1">天津</option>
<option value="2">北京</option>
<option value="3">上海</option>
<option value="4">河北</option>
</select>
</td>
</tr>
<tr>
<td>
性别:
<input name="u2" id="sexID1" type="radio" CHECKED="checked"/>Boy
<input name="u2" id="sexID2" type="radio"/>Girl
</td>
</tr>
<td>
四季:
<input id="u" type="checkbox" value="spring"/>春
<input id="u" type="checkbox" value="summer"/>夏
<input id="u" type="checkbox" value="Auterm"/>秋
<input id="u" type="checkbox" value="winter"/>冬
</td>
<tr>
</tr>
<tr>
<td>
<input class="u16" id="buttonID" type="button" value="submit" onclick="return toAlert()"/>
</td>
</tr>
<tr>
<td>
<a href="http://www.baidu.com">百度首页走起~</a>
</td>
</tr>
</table>
</form>
</div>
<div id="input">和大的DIV并列<input name="check" id="check" type="text" value=""/></div>
<div id="input">没有id和name,是不是傻眼了<input class="stuname" type="text" value=""/></div>
<div class="fathdiv">
<label>第一本书</label>
<label>第二本书</label>
<label>第三本书</label>
<label>第四本书</label>
</div>
</body>
</html>
(一)、练习1:统计出当前页面有多少个div
List<WebElement> list = driver.findElements(By.tagName("div"));
int number = list.size();
System.out.println("一共有"+number+"个div");
(二)、练习2:输出页面第一个div中的文字
String divText = driver.findElement(By.cssSelector("form > div")).getText();
System.out.println(divText);
(三)、练习3:用xpath找出所有的复选框,并点击
List<WebElement> elements = driver.findElements(By.id("u"));
for(int i=0;i<elements.size();i++){
if(elements.get(i).isSelected()==false){
elements.get(i).click();
}
}
(四)、找出input标签中所有属性中含有check,并输出tagname
List<WebElement> elements = driver.findElements(By.xpath("//*[contains(@*,'check')]"));
for(int i=0;i<elements.size();i++){
System.out.println(elements.get(i).getTagName());
}
(五)、找出页面元素,id属性包含o,并输出id名称
List<WebElement> elements = driver.findElements(By.xpath("//*[contains(@id,'o')]"));
for (int i = 0; i < elements.size(); i++) {
String id = elements.get(i).getAttribute("id");
System.out.println("id="+id);
}
(六)、找出页面元素中,id属性为acc开头的,并输入id的名称
List<WebElement> elements = driver.findElements(By.xpath("//*[starts-with(@id,'acc')]"));
for (int i = 0; i < elements.size(); i++) {
String id = elements.get(i).getAttribute("id");
System.out.println("id="+id);
}
(七)、定位到页面文本含有“百度”的元素,并输出文本值
List<WebElement> elements = driver.findElements(By.xpath("//*[contains(text(),'百度')]"));
for (int i = 0; i < elements.size(); i++) {
String text = elements.get(i).getText();
System.out.println("text="+text);
}
(八)、找出页面中最后一个div,并输出其文本值
String text = elements.get(elements.size()-1).getText();
System.out.println(text);
Logger.log("关闭" + browser + "浏览器");
(九)、下拉菜单、单选框,多选框操作
// 下拉菜单的练习
WebElement element = driver.findElement(By.id("areaID"));
Select select = new Select(element);
// select.selectByValue("3");
// select.selectByIndex(2);
select.selectByVisibleText("上海");
//单选框练习
List<WebElement> elements = driver.findElements(By.name("u2"));
if (elements.get(1).isSelected() == false) {
System.out.println(elements.get(1).isSelected());
elements.get(1).click();
}
//复选框的练习
List<WebElement> elementlist = driver.findElements(By.id("u"));
for (int i = 0; i < elementlist.size(); i++) {
if (elementlist.get(i).isSelected() == false) {
elementlist.get(i).click();
}
}
二、复杂元素定位
有时候我们会遇到一些html中只有一个元素属性,其他都没有属性,那么这时候我们就需要从这个属性中,定位到另一个元素
(一)、练习一
已知一个订单商品名字,查找这个订单的状态
步骤
1、定位商品名称的元素
操作:F12浏览器--点击“选取页面中的元素”按钮--把鼠标移动到商品名称上点一下--在查看器右击被选中的html代码,选择复制--xpath,得到如下结果
/html/body/div[2]/div/div[1]/div[1]/div[3]/div/div[4]/div/table/tbody[2]/tr/td[1]/div/div[2]/p[1]/a[1]/span[2]
2、定位这个商品订单状态的元素
同样的方法,使用xpath定位商品订单状态
/html/body/div[2]/div/div[1]/div[1]/div[3]/div/div[4]/div/table/tbody[2]/tr/td[6]/div/p/span
3、取两个定位元素的相交节点
商品名称:/tr/td[1]/div/div[2]/p[1]/a[1]/span[2]
订单状态:/tr/td[6]/div/p/span
4、定位到商品名称
因为"人本"是搜索订单出来的,所以带有文本为红色的样式,只能定位到人本之前的文本,所以如下
//tr/td[1]/div/div[2]/p[1]/a[1]/span[2][contains(text(),'【开学价】')]
5、定位订单的状态
用[]把父节点后面的元素括起来,去掉订单状态的父节点,后面+订单状态的元素即可
//tr[td[1]/div/div[2]/p[1]/a[1]/span[2][contains(text(),'【开学价】')]]/td[6]/div/p/span
(二)、练习二
使用xpath找出元素:根据.succes的尝试一下按钮:https://www.runoob.com/bootstrap/bootstrap-tables.html
步骤
1、找到.success
/html/body/div[3]/div/div[2]/div/div[3]/div/table[2]/tbody/tr[3]/td[1]
2、使用xpath定位“尝试一下”按钮
/html/body/div[3]/div/div[2]/div/div[3]/div/table[2]/tbody/tr[3]/td[3]/a
3、定位“尝试一下”按钮
取两个定位元素的相交节点
tr[3]/td[1]
tr[3]/td[3]/a
定位到.success文本
//tr[3]/td[1][text()=".success"]
用[]把父节点后面的元素括起来,去掉【尝试一下】按钮的父节点,后面+订单状态的元素即可
//tr[3][td[1][text()=".success"]]/td[3]/a
更多的练习请到: http://sahitest.com/demo/index.htm