Selenium + Python 自动化测试03（元素定位）

        上一篇我们讲述了第一个测试用例脚本的编写。我们对web自动化测试有了一个初步的认识。接着我们详细讲述元素定位方法。

        Selenium对网页的控制是基于各种前端元素的，在使用过程中，对于元素的定位是基础，只有准去抓取到对应元素才能进行后续的自动化控制，定位元素方法总结归纳一下：8种基本元素定位方式：保证定位到唯一性是目的，这样在执行中才不会出错。

1、8种定位方法：

1）id 定位

2）name 定位

3）class 定位

4）link_text 定位

5）partial_link_text 定位

6）CSS 定位

7）Xpath 定位

8）tag_name 定位

2、如何查看元素

      这里以Chrome 浏览器来讲述。

1）先打开要定位元素的网页

2）F12查看到元素结构

如下图，展示本页面所有的元素

3）找到对应控件元素

每个元素都有不同的标签名和属性值。点击输入框-右击-查看

4）查看对应元素的描述

对应下图就展示对应元素的层级位置，以及元素的属性

我们把输入框的元素复制出来，就是有id，name,class 和对应属性值。希望详细了解的可以参考前端HTML的基础知识。

<input class="input_error form_input" placeholder="Username" type="text" data-test="username" id="user-name" name="user-name" autocorrect="off" autocapitalize="none" value="">

3、定位方法实践

        3.1、id定位

以下图输入框为例，对应的元素id的名字是：id="user-name"

#输入用户名
        
 driver.find_element_by_id("user-name").send_keys(username) # by id 定位

3.2、name 定位

和id的类似，就不赘述

对应的元素name的名字是：name="user-name"

driver.find_element_by_id("user-name").send_keys(username) # by id 定位

3.3、class 定位

和id的类似，就不赘述

对应的元素name的名字是：class="input_error form_input"

driver.find_element_by_class_name("input_error form_input").send_keys(username)   # by class 定位

3.4、link_text 定位

link_text 是以超链接全部名字作为关键字来定位元素的。以百度首页“新闻”超链接为例，如下图 1.所示，关键字为“新闻”。

<a href="http://news.baidu.com" target="_blank" class="mnav c-font-normal c-color-t">新闻</a>

对应元素的target：新闻

#定位link_text
driver.find_element_by_link_text("新闻").click() #通过link_text

3.5、partial_link_text 定位

是link_text 定位的一种补充，有些文本链接比较长，这个时候我们可以取其中一部分进行定位。

如类似上面的例子：上面百度的新闻使用“新”定位

driver.find_element_by_partial_link_text("新").click() #通过partial_link_text定位

3.6、CSS 定位

CSS :cascading style sheets 是一种语言，它用来描述HTML 、XML文档的表现。CSS通过选择器为页面元素绑定属性。

  1）通过class属性定位：点号（"."）表示通过class属性定位

元素：  <input class="u-btn mart5" type="submit" οnclick="return User.check()" value="登录">
定位写法：driver.find_element_by_css_selector(".u-btn.mart5").click()

  2）通过id属性定位：（"#"）表示通过id定位元素

driver.find_element_by_css_selector("#loginName")

  3）通过其他属性定位：（"[]"），中括号里的属性可以唯一标识这个元素就可以；属性的值可以加引号，也可以不加

元素： <input class="u-btn mart5" type="submit" οnclick="return User.check()" value="登录">
写法： driver.find_element_by_css_selector("[type=submit]").click()

  4）组合定位

       平时使用生成的xpath，id，name，classname这些比较多，我们当然可以把上面的定位策略组合起来使用，这就大大加强了定位元素的唯一性。如下：

driver.find_element_by_css_selector("form.fm>span>input.s_ipt")

3.7Xpath 定位

1)特点：

通过 XPath 来定位元素的方式，对比较难以定位的元素来说很有效，几乎都可以解决，特别是对于有些元素没有 id、name 等属性的情况。

XPath 是 XML Path 语言的缩写，是一种用来确定 XML 文档中某部分位置的语言。它在 XML 文档中通过元素名和属性进行搜索，主要用途是在 XML 文档中寻找节点。XPath定位比 CSS 定位有更大的灵活性。XPath 可以向前搜索也可以向后搜索，而 CSS 定位只能向前搜索，但是 XPath 定位的速度比 CSS 慢一些。

XPath 语言包含根节点、元素、属性、文本、处理指令、命名空间等。

2）定位策略-绝对路径

通过写出元素的绝对路径来定位：

绝对路径可以通过下面的方法copy出来，是不是很方便！

选中元素-右击-copy-copy Xpath：

也可以手写，就是按层级结构写下来。

对照层级写绝对地址：driver.find_element_by_xpath("/html/body/div/div/div[2]/div/div/div/div/input")

3）定位策略-相对地址

//表示相对的位置，再加一些限定的属性值来定位到元素：页面相对复杂度高的时候这个就比较有用。

如下通过相对位置的id值：//*[@id='user-name'] 

driver.find_element_by_xpath("//*[@id='user-name']").send_keys(username)  #通过xpath定位

3.8、tag_name 定位

HTML 的本质就是通过tag 来实现不同功能，每一个元素本质上也是一个tag。因为一个tag往往用来定义一类功能，所以通过tag唯一识别某个元素的概率比较低。用的相对比较少。

如下图：定位标签“form”并打印标签属性值“name”。

str=driver.find_element_by_tag_name("form").get_attribute("name") #获取form名字
print(str)

两外，现在有另一种写法。用By定位元素

　　除find_element_by_***这种方式，还有另一套写法，也就是统一调用find_element()方法，两个参数，第一个参数是定位的类型，由By提供；第二个参数是定位的具体值。例子如下：

from selenium.webdriver.common.by import By     #使用By这种定位前要将By类导入

find_element(By.ID,"loginName")
find_element(By.NAME,"SubjectName")
find_element(By.CLASS_NAME,"u-btn-levred")
find_element(By.TAG_NAME,"input")
find_element(By.LINK_TEXT,"退出")
find_element(By.PARTIAL_LINK_TEXT,"退")
find_element(By.XPATH,".//*[@id='Title")
find_element(By.CSS_SELECTOR,"[type=submit]")

以上就是我这边了解的定位元素的方法了，麻烦各位大佬不吝赐教。谢谢！