上一期介绍了自动化测试Python+Selenium框架的基本介绍，这期讲元素定位。

元素定位

1.WEB自动化时利器–浏览器自带开发者工具

几乎所有浏览器都自带前端调试工具，也就是我们说的开发者工具。

开发者工具包括元素（ELements）、控制台（Console）、源代码（Sources）、网络（Network）、性能（Performance）等页签，可以分别点击查看。

元素（Elements）：用于查看或修改HTML元素的属性、CSS属性、监听事件、断点。

控制台（Console）：控制台一般用于执行一次性代码，查看JavaScript对象，查看调试日志信息或异常信息。

源代码（Sources）：该页面用于查看页面的HTML文件源代码、JavaScript源代码、CSS源代码，此外最重要的是可以调试JavaScript源代码，可以给JS代码添加断点等。

网络（Network）：网络页面主要用于请求数据的查看，网络连接相关的信息。

这些页签开发同学用的多些，我们测试人员一般使用元素（Elements）和网络（Network）。

其中做web自动化要用到元素

（Elements）

这个模块的功能，接口或性能测试使用网络（Network）。

2.如何调出开发者工具

一般直接F12即可打开开发者工具。

以chrome浏览器为例，也可以通过菜单打开：工具–更多工具–开发者工具

 

打开后页面如下，切换到第一个元素（Elements）页签：

 

可以改变开发者工具的出现位置和方式，谷歌中默认是浏览器右侧：

 

如何查看web元素

做自动化要找一个某个元素，要查看元素有没有NAME或ID属性，在浏览器渲染后的页面是看不到的，此时可以通过开发者工具进行查看。

F12快捷键打开开发者工具，点击其左上角鼠标图标。点击后图标变蓝，此时移动鼠标到web界面的各个元素上，可以看到元素信息，及对应元素定义代码块。

 

找到目标元素后，点击鼠标，则完成元素选择，右侧展示当前选中鼠标的信息。

 

元素确定后，可以通过右键菜单，进行添加删除元素、编辑元素属性等操作：

 

也可以在当前前端文件中，进行元素查找匹配，鼠标定位到任意一行代码，按快捷键ctrl+f，在输入框中输入搜索字符串后回车，可以看到：总匹配个数，当前匹配元素。也可以上下键查看所有匹配项。

 

简单元素定位

所有的自动化工具要模拟用户操作，一般都要识别出用户在对哪个元素做什么操作

哪个元素即通常大家说的元素定位。我们需要告诉Selenium操作哪个元素，Selenium根据我们提供的信息到运行程序上进行元素匹配，匹配到即进行操作

WebDriver 提供了8大元素定位方式，我们先看前六种元素定位方式。

1.根据Id定位

假设要操作的Web元素定义如下：

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

这里有个属性是id=”su”，那么我们可以根据id进行元素定位：

element = driver.find_element_by_id("su")

2.根据Name定位

<input name="wd" value="" maxlength="255" autocomplete="off">

这里有个属性是name=”wd”，那么我们可以根据name进行元素定位：

element = driver.find_element_by_name("wd")

3.根据LinkText定位

超链接在web网站中很常见，通过它可以实现页面的跳转。

以百度搜索为例，通过开发者工具，看到如下超链接的创建语句：

 

我们看到超链接a标签即没有id也没有name属性，那么我们怎么找到它？

如果一个页面有多个超链接，那么至少从超链接文本上能够区分，如：

 

同样的，selenium中也根据link text进行超链接定位，要查找第一个超链接，把它的超链接文本作为参数传递给

find_element_by_link_text方法：

Link_element = driver.find_element_by_link_text("自动化专业现在吃香吗")

4.根据PartialLinkText定位

我们可以做超链接字符串的部分匹配：

<a href="http://www.baidu.com/link?url=sbTmg8KItCLNs3d5QZ-bDBjXlknt-sw1hySgXGDD7jBRiS3khVBjqovhnXyNbbjwSviUJ2WQeg8ut9iX2wZz0a" target="_blank"><em>Python</em>(计算机程序设计语言)_百度百科</a>

超链接字符串为：Python(计算机程序设计语言)_百度百科

部分匹配：在当前页面查找超链接字符串包含“_百度百科”的元素

ele = driver.find_element_by_partial_link_text("_百度百科")

ele.click()

5.根据class Name定位

每个元素在定义时有class属性，相当于把这个元素划归到某类中：

<input value="" maxlength="255" autocomplete="off">

则可以根据类别名称进行定位：

ele = driver.find_element_by_class_name("s_ipt")

* 如果元素定义时class值中间带空格，相当于这个元素同时属于多个类别：

<span class="bg s_ipt_wr quickdelete-wrap"></span>

按照整个class的值定位会失败，可以根据某个类名定位：

ele = driver.find_element_by_class_name("s_ipt_wr")

6.根据tag Name定位

每个元素在HTML文件中，都有个标签名称，如input，div，form，span等

<input value="" maxlength="255" autocomplete="off">

若元素没有id，name这些易于定义的属性，也可以根据标签名称input进行定位：

ele = driver.find_element_by_tag_name("input")

* 通常一个页面上同类型的标签会不止一个，需要进行过滤。

根据xpath进行元素定位

在前边的6种元素定位方式中，如果元素没有id或name，或者根据class名称tag名称无法准确定位到元素的话，就可以采用xpath进行元素定位。

XPath 是一门在 XML 文档中查找信息的语言。 它使用路径表达式在 XML 文档中进行内容查找。

1.Xml术语

节点在 XPath 中，有七种类型的节点：元素、属性、文本、命名空间、处理指令、注释以及文档（根）节点。XML 文档是被作为节点树来对待的

如：

<?xml version=”1.0″ encoding=”UTF-8″?>
<bookstore>
<book>
<title>Harry Potter</title>
<author>J K. Rowling</author>
<year>2005</year>
<price>29.99</price>
</book>
</bookstore>

其中有如下结点：

<bookstore> (文档节点)
<author>J K. Rowling</author> (元素节点)
(属性节点)

基本值是无父或无子的节点。

基本值的例子：

J K. Rowling
“en”

2.节点关系

节点之间可能是父子，兄弟，同胞，先辈或后代的关系。

<bookstore>
<book>
<title>Harry Potter</title>
<author>J K. Rowling</author>
<year>2005</year>
<price>29.99</price>
</book>
</bookstore>

Book节点是title、author等节点的父节点，同时，title、author是book的子节点。

Title、author、year、price之间是同胞关系。

Bookstore是title、author和book的先辈节点，同时bookstore的后辈节点是title、author和booke等节点。

3.xpath语法

XPath 使用路径表达式来选取 XML 文档中的节点或节点集。节点是通过沿着路径 (path) 或者不 (steps) 来选取的。

<?xml version=”1.0″ encoding=”UTF-8″?>

<bookstore>

<book>

<title>Harry Potter</title>

<price>29.99</price>

</book>

<book>

<title>Learning XML</title>

<price>39.95</price>

</book>

</bookstore>

4.选取节点

XPath 使用路径表达式在 XML 文档中选取节点。节点是通过沿着路径或者 step 来选取的。下面列出了最有用的路径表达式：

 

5.谓语

谓语用来查找某个特定的节点或者包含某个指定的值的节点。

谓语被嵌在方括号中。

在下面的表格中，我们列出了带有谓语的一些路径表达式，以及表达式的结果：

 

 

6.选取未知节点

XPath 通配符可用来选取未知的 XML 元素。

 

find_element与find_elements方法的区别

自动化过程中，通过find_elemet_by_id方法进行元素定位时，有时操作不到目标元素。原因可能是由于页面代码开发时不够规范，不同的元素id相同。

针对这种情况，Selenium开发了两套find方法，如下：

find_element_by_id          find_elements_by_id

find_element_by_name        find_elements_by_name

find_element_by_tag_name    find_elements_by_tag_name

find_element_by_xpath       find_elements_by_xpath

等等

那么两套方法使用上有何区别：

若匹配到元素：

find_element返回第一个匹配WebElement元素

Find_elements返回列表，包括所有匹配元素

若匹配不到元素：

find_element报异常

Find_elements返回空列表

两套方法使用时根据实际情况选择。

如果确定当前一个元素定位方式到底匹配到几个元素呢？可以在chrome的开发者工具中直接做验证，获取使用火狐浏览器的插件进行验证都可以。