前言

最近在学习 UI 自动化，但是前端基础很薄弱 (约等于 0)，在编写脚本过程中发现，正确的查找和获取 UI 元素有点困难，特此记录，仅做笔记。

查找 UI 元素 (web 元素)

WebDriver 实例可以查找 UI 元素。每种语言实现都暴露了 “查找单个元素” 和 “查找所有元素” 的方法。第一个方法如果找到则返回该元素，如果没找到则抛出异常。第二种如果找到则返回一个包含所有元素的列表，如果没找到则返回一个空数组。

查找页面元素方法

“查找” 方法使用了一个定位器或者一个叫 “By” 的查询对象。“By” 支持的元素查找策略如下：
（1）By id
这是最高效也是首选的方法用于查找一个元素。UI 开发人员常犯的错误是，要么没有指定 id，要么自动生成随机 id，这两种情况都应避免。即使是使用 class 也比使用自动生成随机 id 要好得多。
HTML：

<div id="coolestWidgetEvah">...<div>

JAVA：

WebElement element = driver.findElement(By.id("coolestWidgetEvah"));

（2）By Class Name
“class” 是 DOM 元素上的一个属性。在实践中，通常是多个 DOM 元素有同样的 class 名，所以，通常用它来查找多个元素。
HTML：

<div class="cheese"><span>Cheddar</span></div><div class="cheese"><span>Gouda</span>

Java:

List<WebElement> cheeses = driver.findElements(By.className("cheese"));

（3）By Tag Name
根据元素标签名查找：
HTML:

<iframe src="..."></iframe>

Java:

WebElement frame = driver.findElement(By.tagName('"iframe"));

(4) By Name
查找 name 属性匹配的表单元素
HTML:

<input name="cheese" type=""text>

Java:

WebElement cheese = driver.findElement(By.name("cheese"));

(5) By Link Test
查找链接文字匹配的链接元素
HTML:

<a href="http://www.google.com/search?q=cheese">cheese</a>

Java:

WebElement cheese = driver.findElement(By.linkText("cheese"));

(6) By Partial Link text
查找链接文字部分匹配的链接元素
HTML:

<a href="http://www.google.com/search?q=cheese">search for cheese</a>

Java:

WebElement cheese = driver.findElement(By.partialLinkText("cheese"));

(7) By css
正如名字所表明的，它通过 css 来定位元素。默认使用浏览器本地支持的选择器，可参考 w3c 的 css 选择器。如果浏览器默认不支持 css 查询，则使用 Sizzle。ie6、7 和 ff3.0 都使用了 Sizzle。
注意使用 css 选择器不能保证在所有浏览器里都表现一样，有些在某些浏览器里工作良好，在另一些浏览器里可能无法工作。
HTML:

<div id="food"><span class="dairy">milk</span><span class="dairy aged">cheese</span></div>

Java:

WebElement cheese = driver.findElement(By.cssSelector("#food span.dairy.aged"));