元素定位
如何进行元素定位?
元素:由标签头+标签尾+标签头和标签尾包括的文本内容
元素的信息就是指元素的标签名以及元素的属性
元素的层级结构就是指元素之间相互嵌套的层级结构
元素定位最终就是通过元素的信息或者元素的层级机构来进行元素定位
Selenium 八种定位元素方法
-
find_element_by_id
-
find_element_by_name
-
find_element_by_link_text
-
find_element_by_partial_link_text
-
find_element_by_tag_name
-
find_element_by_class_name
-
find_element_by_css_selector
-
find_element_by_xpath
id定位:根据id来获取元素,返回单个元素,id值一般是唯一的 ;
name定位:根据元素的name属性定位;
class_name定位:根据元素的样式class值定位;
tag_name定位:根据元素的标签名来定位;
link_text定位:根据超链接的文本值定位;
partail_link_text定位:根据超链接的部分文本值定位;
xpath定位:通过元素的路径、属性定位;
css定位:css选择器定位;
id定位
通过元素的id属性值来进行元素定位,在HTML标准规范中id值是唯一的。
说明:元素要有ID属性。
定位方法:find_element_by_id(id) #id参数表示的是id的属性值。
name定位
通过元素的name属性值为进行元素定位 name属性值在HTML页面中,是可以重复的。
说明:元素要有name属性。
定位方法:find_element_by_name(name) #name参数表示的是name的属性值。
class_name定位
通过元素的class属性值进行元素定位 class属性值是可重复的;
说明:元素必须要有class属性
定位方法:find_element_by_class_name(class_name) #重点:class_name参数表示的是class的其中一个属性值
tag_name定位
通过元素的标签名称进行定位,在同一个HTML页面当中,相同标签元素会有很多。
这种定位元素的方式不太建议大家在工作当中使用。
定位方法:find_element_by_tag_name(tag_name) #tag_name表示的是元素的标签名称。
如果有重复的元素,定位到的元素默认都是第一个元素。
定位一组元素
定位一组元素的方法:
find_elements_by_id(id)
find_elements_by_class_name(class_name)
定位一组元素返回的值是一个列表
可以通过下标来使用列表中的元素
下标是从0开始
xpath定位
XPath即为XML Path的简称,它是一门在XML文档中查找元素信息的语言。
HTML可以看作是XML的一种实现,所以Selenium用户可以使用这种强大的语言在Web应用中定位元素。
XML:一种标记语言,用于数据的存储和传递。后缀.xml结尾
Xpath定位策略
路径定位
属性定位
属性与逻辑结合
属性与层级结合
路径定位
定位方法:find_element_by_xpath(xpath) #xpath表达式
绝对路径
表达式是以/html开头,元素的层级之间以“/”分隔。
相同层级的元素可以使用下标,下标是从1开始。
需要列出元素所经过的所有层级的元素,工作中一般不适用绝对路径。
例如:
/html/body/div[7]/div[2]/div[1]
find_element_by_xpath("/html/body/div/div/div/div/div/from/span/input")
绝对路径定位,只要页面元素稍微改动,就会定位失败,维护成本比较高,所以并不建议使用xpath绝对定位的方式。
相对路径
利用属性定位
通过元素的属性定位,比如id、name、class等属性,属性匹配定位语法:“//标签名[@属性='属性值'] ",//表示当前节点, @表示选取属性 ,标签名比如div, span等,也可用 * 表示任意标签。
匹配任意层级的元素,是以//tag_name或者//*开头
也可以使用下标,下标是从1开始,如://p[5]/button
元素属性定位
//或者//tag_name
//*[@attribute='value'] #attribute表示的是元素的属性名,value表示的是元素对应属性值
层级与属性结合定位
以百度搜索框为例, 我们可以找到搜索框input标签的上级标签span, 上上级标签form:
我们通过上级标签span,及上上级标签form分别进行定位:
如果通过元素自身的信息不方便直接定位到该元素,则可以先定位到其父级元素,然后再找到该元素.
//*或者//tag_name开头 //*[@id='p1']/input
属性与逻辑结合定位
逻辑运算符比如and ,or ,not ,多种条件组合定位。
//*或者//tag_name开头
//*[@attribute1='value1' and @attribute2='value2']
用百度搜索框为例,使用id加name两种属性组合定位。
xpath扩展
//*[text()='value'] | value表示要定位的元素的全部文本内容 | 如://*[text()='新闻'] 通过元素的全部文本内容进行定位 |
//*[contains(@attribute,'value')] | attribute:表示的属性名称,value:表示属性的文本内容 要定位的元素中,attribute属性的属性值包含了value的内容 | 如://*[contains(@unioname,'TAX_')] |
//*[start-with(@attribute,'value')] | attribute:表示属性的名称,value:表示的是字符串 要定位的元素,attribute属性的属性值是以value开头 | |
//*[@class='value'] | 如果使用class的属性进行元素定位,需要用到class里面所有的值 | //*[@class='kui-textphone validatebox-text validatebox-must'] |
CSS定位
css相对xpath来说,语法更简洁、定位速度更快,xpath能定位到的,css一般也能定位到;
css定位是通过css选择器进行定位,我们需要了解css选择器的一些知识才能进行css定位,选择器基本语法如下:
-
通过id、class属性定位
css写法就是 .s_ipt , #kw
2.通过其他属性定位
不是通过属性就一定能定位到元素,要看属性是否唯一。
3.通过层级关系定位
通过上下层级关系进行层层定位,百度搜索框的层级元素如下:
4.通过逻辑关系定位
css逻辑关系定位与xpath类似,但是css不需要写and。
以百度搜索框的id属性和class属性为例,代码如下:
xpath与css定位对比