s页面代码：
<html><body>
<form id=”loginForm”>
<input name=”username” type=”text” />
<input name=”password” type=”password” />
<input name=”continue” type=”submit” value=”login” />
<input name=”continue” type=”button” value=”clear” />
</form>
</body></html>
Xpath：//开头
/html/body/form[1] 绝对路径
//form[1] HTML中的第一个form元素
//form[@id=’loginForm’] id为loginForm的元素
//form[input@name=’username’]
定位有name为username的input子元素的form
//input[@name=’username’]
定位input元素且其name为‘username’
//form[@id=’loginForm’]/input[1]
在id为‘loginForm’的form下，定位第一个input元素
//input[@name=’continue’][@type=’button’]
定位name为‘continue’，type为‘button’的input元素
Css定位
direct child
|
//div/a |
css=div > a |
child or subchild
|
//div//a |
Css=div a |
Id ( # 代表id)
|
//div[@id=’example’]//a |
Css=div#example a |
|
<input id="ag_name" type="text"...> |
css=input#ag_name or css=#ag_name |
Class ( .代表class)
|
//div[@class=’example’]//a |
Css=div.example a |
|
<button id="ext-eng=1026" class="x-right-button"...> |
css=button.x-right-button |
如果class里带的空格，用.来代替空格如：
<button class="x-btn-text module_picker_icon">...
css=button.x-btn-text.module_picker_icon
属性定位（[属性名=值 ]）
方括号 [ 属性名=属性值 ] 的方式，如：
|
css=abbr[title="Abc"] |
页面代码
<html><body>
<form id=”loginForm”>
<input class=”required” name=”username” type=”text” />
<input class=”required passfield” name=”password” type=”password” />
<input name=”continue” type=”submit” value=”login” />
<input name=”continue” type=”button” value=”clear” />
</form>
</body></html>
Css=form#loginForm 定位id为loginForm的form元素
Css=input[name=”username”] 定位username元素
Css=input.required[type=”text”]
定位class为required，类型为text的元素
Css=input.passfield 定位password元素
Css=#loginForm input[type=”button”]
定位id为loginForm 下的type为button的元素
Css=#loginForm input:nth-child(2)
定位id为loginForm 下的第二个input子元素
contains（ :contains(“XXX”) ）
定位一个显示OK的Button，但页面上有几个Button，id是自动生成的，class是一样的
<button id="eng-6"class="right-btn">OK</button>
<button id="eng-7"class="right-btn">Cancel</button>
css=button. right-btn:contains("OK")
:contains是个Pseudo-class，用冒号开头，括号里是内容。
Pseudo-classes是CSS提供的伪类，用来访问页面上DOM tree之外的信息，还有Pseudo-elements 用来最精准的定位页面上的某一行文字，甚至某一行文字的第一个字母。
$x("//a[contains(@href,'http://www.dezhi.hk/student/edit-avatar')]")
<table><tr><td><div><span>abcd</span><span>1234</span></div></td></tr></table>
xpath=//table/tr/td/div/span[1]
css=table>tr>td>div>span:nth-child（1）
css=
div.dz_index_login2 li:nth-child(2)>input:nth-child(1)
Id（id=’loginForm’）
name（name=’username’）
默认定位器（未指定locatortype， 默认使用identifier定位）
Identifier定位（id、name）
通过link专用定位超链接
Link=continue
Link=cancel
Dom定位：document开头
Document.getElementById(‘loginForm’) 定位id为’loginForm’的元素
Document.forms[‘loginForm’] 定位form元素
Document.form[0] 定位第一个form元素
Document.forms[0].username 定位第一个form下的username元素
Document.form[0].elements[‘username’] 定位username元素
Document.form[0].elements[0] 定位username元素
Document.forms[0].elements[3] 定位continue元素
•dom=document.images[56]
•dom=function foo() { return document.links[1]; }; foo();
ancestor 选择当前结节点所有的父类元素，包括祖先元素。
td[text()=’Product’]/ancestor::table 得到table元素
. •xpath=//img[@alt='The image alt text']
•xpath=//table[@id='table1']//tr[4]/td[2]
•xpath=//a[contains(@href,'#id1')]
•xpath=//a[contains(@href,'#id1')]/@class
•xpath=(//table[@class='stylee'])//th[text()='theHeaderText']/../td
•xpath=//input[@name='name2' and @value='yes']
•xpath=//*[text()="right"] $x("//*[text()='保存修改']")
xpath(=//input[@type='submit'and @value='Login']
By.xpath=//input[@type='submit'or @value='Login']"
(By.xpath ("img[@alt]"));
所有input元素中是否有属性等于”userName”，并将其返回。
Xpath=//input[@*='username'] ;
$x("//a[contains(text(),'新闻')]")
•link=textPattern: Select the link (anchor) element which contains text matching the specified pattern. •link=The link text
WebElement gmailLink = driver.findElement(By.linkText("GMail"))
driver.findElement(By.partialLinkText("Inbox"));
•css=a[href="#id3"]
•css=span#firstChild + span
List<WebElement> imagesWithAlt = driver.findElements(By.cssSelector("img[alt]")); 所有有alt属性的img
By.cssSelector("img:not([alt])") not（）伪类
By.cssSelector("a[innerText='新闻']);
By.cssSelector("a[textContent='新闻']"));
jquery （prev + next） Finds all inputs that are next to a label $( "label + input" ).
prev: Any valid selector.
next: A selector to match the element that is next to the first selector.
^= 开始于 starts-with()
Input[id^='ctrl'] Input[starts-with(@id,’ctrl’)]
$= 结束于 ends-with()
*= 包含 contains()
:first-child :last-child :nth-child(2)
form#loginForm :first-child
form#loginForm :nth-child(2)
public void tableTest() {
driver.get("http://www.w3school.com.cn/html/html_tables.asp");
//首先得到所有tr的集合
List<WebElement> rows =
driver.findElements(By.cssSelector(".dataintable tr"));
//验证表格的行数
assertEquals(11,rows.size());
//打印出所有单元格的数据
for (WebElement row : rows) {
//得到当前tr里td的集合
List<WebElement> cols =
row.findElements(By.tagName("td"));
for (WebElement col : cols) {
System.out.print(col.getText());//得到td里的文本
}
System.out.println();
}
<?xml version="1.0" encoding="ISO-8859-1"?>
<bookstore>
<book category="children">
<title lang="en">Harry Potter</title>
<author>J K. Rowling</author>
<year>2005</year>
<price>29.99</price>
</book>
<book category="cooking">
<title lang="en">Everyday Italian</title>
<author>Giada De Laurentiis</author>
<year>2005</year>
<price>30.00</price>
</book>
<book category="web">
<title lang="en">Learning XML</title>
<author>Erik T. Ray</author>
<year>2003</year>
<price>39.95</price>
</book>
<book category="web">
<title lang="en">XQuery Kick Start</title>
<author>James McGovern</author>
<author>Per Bothner</author>
<author>Kurt Cagle</author>
<author>James Linn</author>
<author>Vaidyanathan Nagarajan</author>
<year>2003</year>
<price>49.99</price>
</book>
</bookstore>
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("book")[0].attributes;
document.write(x.getNamedItem("category").nodeValue);
document.write("<br />" + x.length);
输出：Children 1 book 的 "category" 属性的值，以及其属性的数量：
元素节点的 attributes 属性为属性节点的列表，x.length 为属性列表长度
在 DOM 中，每种成分都是节点。元素节点没有文本值。元素节点的文本存储在子节点中。该节点称为文本节点。获取元素文本的方法，就是获取这个子节点（文本节点）的值。属性节点拥有文本值。获取属性的值的方法，就是获取它的文本值。可以通过使用 getAttribute() 方法或属性节点的 nodeValue 属性来完成这个任务
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("title")[0].childNodes[0]
txt=x.nodeValue;
document.write(txt);
document.write("<br />");
document.write(xmlDoc.getElementsByTagName("author")[0].childNodes[0].nodeValue);
document.write("<br />");
document.write(xmlDoc.getElementsByTagName("year")[0].childNodes[0].nodeValue);
输出：Harry Potter J K. Rowling 2005
•第一个 <title> 元素节点的文本节点的值
为每个文本节点使用childNodes[0]，即使每个元素只有一个文本节点，
这是由于 getElementsByTagName() 方法总是会返回数组
1. getElementsByTagName() -----------返回拥有指定标签名的所有元素，会返回数组。
返回 x 元素下的所有 <title> 元素：x.getElementsByTagName("title");
返回 XML 文档中的所有 <title> 元素：xmlDoc.getElementsByTagName("title");
|
nodeName 节点的名称 只读 |
nodeType 节点类型 只读 |
nodeValue 节点的值 |
|
|
元素节点 |
标签名 |
1 |
undefined |
|
属性节点 |
属性的名称 |
2 |
属性的值 |
|
文本节点 |
#text |
3 |
文本自身 |
|
文档节点 |
#document |
9 |
：
|
• x.nodeName - x 的名称 • x.nodeValue - x 的值 • x.attributes - x 的属性节点 • x.parentNode - x 的父节点 • x.childNodes - x 的子节点 元素节点的 attributes 属性返回属性节点的列表 |
•x.getElementsByTagName(name) - 获取带有指定标签名称的所有元素 •x.appendChild(node) - 向 x 插入子节点 •x.removeChild(node) - 从 x 删除子节点 getElementsByTagName 是方法 childNodes 和 nodeValue 是属性。 x 是一个节点对象。 |
|
xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName("book")[0].childNodes; y=xmlDoc.getElementsByTagName("book")[0].firstChild; for (i=0;i<x.length;i++){ if (y.nodeType==1) {//Process only element nodes (type 1) document.write(y.nodeName + "<br />"); } y=y.nextSibling;} |
1.通过使用 loadXMLDoc() 把 "books.xml" 载入 xmlDoc 中 2.获得第一个 book 元素的子节点 3.把 "y" 变量设置为第一个 book 元素的第一个子节点 4.检查每个子节点的节点类型，如节点类型是 "1"，则是元素节点 5.如果是元素节点，则输出该节点的名称 6.把 "y" 变量设置为下一个同级节点，并再次运行循环 |
Jquery
<!DOCTYPE html>
<html><head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("p").hide();
});
});
</script>
</head>
<body>
<h2>This is a heading</h2>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<button>Click me</button>
</body>
</html>
CSS Selectors
|
Selenium WebDriver准备阶段 |
|
阶段一:脚本流程及各browsers启动配置profile Testng对webdriver的流程测试管理 各主流browsers的运行及profile配置 |
|
阶段二:数据驱动及等待 Testng参数化，properties文件驱动webdriver WaitClass介绍 TestNG断言类 |
|
阶段三测试须知java基础 Java中的面向对象及常用类 Webdriver脚本实践PageObject化 |
|
阶段四:Webdriver API常用方法 iframe,windows的跳转 下拉列表，上传文件 Actions类鼠标右击，拖放 |
|
阶段五:页面对象化及动态xpath PageFactory类强化 脚本中支持动态xpath PageFactory类强化 支持动态xpath |
|
阶段六:Webdriver与Testlink集成 1.配置使用testlink 2.了解TestLink API Webdriver中调用TestLink api实现结果上传 |
|
阶段七:Autoit及数据库sqlite 1.Sqlite manager实用 2.Autoit工具实用 |
|
阶段八:分布并行测试Grid 1.了解Json 2.webdriver中实现多node执行脚本 |