web端功能自动化定位元素

前言

要进行UI自动化，就必须对web端页面元素进行操作，要操作就要能够定位元素，通俗的讲就是要程序能够找到元素的位置。一些主要的定位元素方法如下。

1、webdriver提供了一些元素定位方法，常用的几种如下;

id、name、class name、tag name、link text、partial link text、css selector、xpath

2、webdriver对应的python webdriver方法如下：

find_element_by_id()---定位元素id

find_element_by_name()--定位元素name

find_element_by_class_name()--定位元素class name

find_element_by_tag_name()--定位元素的标签名如：div、input、a

find_element_by_link_text()--定位元素的链接文本

find_element_by_partial_link_text()--定位元素的部分链接文本，包含链接文本的一部分即可

find_element_by_xpath()--定位元素路径

find_element_by_css_selector()--定位css元素

3、id、name、class name、tag name、link text、partial link text这几种方式定位都比较简单，只要把定位的对应元素值填写到相应的定位方法中即可。

例子如下：

<input id="user_id" name="user_name"  class="cl_name" />

（1）find_element_by_id(“user_id”)

（2）find_element_by_name(“user_name”)

（3）find_element_by_class_name("cl_name")

（4）find_element_by_tag_name(“input”)

<a href="#"    name="new">测试</a>

（5）find_element_by_link_text(“测试”)

（6）find_element_by_partial_link_text(“测”)

4、css selector和xpath的方法就稍微复杂些，实战中页面元素都是比较复杂，常用这两种方式。

（1）css seletor

例子：

<div   id="divid"   class="cl_div"     title="hello world">

       <h1>标题</h1>

        <ul><li>1</li><li>2</<li><li>3</li><li>4</li>

</div>

①标签：find_element_by_css_selector(“div”)  

②by id：find_element_by_css_selector("div#divid")   

③by class：find_element_by_css_selector("div.cl_div")

④by属性：     

find_element_by_css_selector("div[title=hello hi world]")--属性title等于

find_element_by_css_selector("div[title^=hello]")--属性title以hello开头

find_element_by_css_selector("div[title$=world]")--属性以world结尾

find_element_by_css_selector("div[title*=hi]")--属性title包含hi

⑤定位子元素：

find_element_by_css_selector("div#divid*")

find_element_by_css_selector("div#divid>h1")

⑥定位后代元素：

find_element_by_css_selector("div h1")

⑦by index:

find_element_by_css_selector("li:nth(2)")

⑧by content:

find_element_by_css_selector("li:contains('2'))

5、xpath一种在XML文档中定位元素的语言，用来查询节点。

相对路径//、绝对路径/

①绝对路径定位：

find_element_by_xpath（"/html/body/div[2]/form/span/input"）

②相对路径定位：

find_element_by_xpath(“//tag[@id='value'”)--自身id属性定位

find_element_by_xpath(“//tag[@id='value'/tag”)--通过上一级目录id属性定位

find_element_by_xpath(“//tag[@name='value'”)--自身name属性定位

find_element_by_xpath(“//a[text()='忘记密码']”)--通过text()方法包含文本内容定位

find_element_by_xpath(“//tag[contains(attribute,'value')]”)--contains方法包含属性定位

find_element_by_xpath(“//tag[start-with(attribute,'value')]”)--start-with以什么开始

find_element_by_xpath(“//preceding-sibling::tag”)--平级节点定位

find_element_by_xpath(“//parent::tag”)--父级节点定位

find_element_by_xpath（“//follow-sibling::tag”）--兄弟节点