selenium--元素定位

Posted 2020-12-14 guang2508

定位界面元素

1、根据元素特征：id,name,class,tag，超链接　　

写法1：

ele=driver.find_element_by_id(‘kw‘)

写法2：

from selenium.webdriver.common.by import By
ele=driver.find_element(by=By.ID,value=‘kw‘)

　tag为元素标签，类似div，span等

　超链接：driver.find_element_by_link_text(‘转到百度‘)

　　　　　driver.find_element_by_partial_link_text(‘百度‘)    #根据部分超链接文本定位元素，模糊匹配

 

2、css

1、选择元素的方法 tag/id/class

• 根据ID，用 #　　ele=driver.find_element_by_css_selector(‘#food‘)
• 根据class，用 . 　　ele=driver.find_element_by_css_selector(‘.vegetable‘)
• 根据tag和class或id的组合写　　ele=driver.find_element_by_css_selector(‘span.vegetable‘)
• 查找 在ID为food的后代元素中 标签为span且class为vegetable 的元素 ele=driver.find_element_by_css_selector(‘#food span.vegetable‘)
• 后代元素用空格 ，直接子元素用 >

 

2、组选择，同时选择多个元素，用逗号隔开

语法<s1>,<s2>

比如：p,button　　#food,.cheese

组合使用：

1、选择  id为food的所有span子元素  和  所有的p （包括非food的子元素）：#food>span,p

2、选择  id为food的  所有span子元素和所有的p子元素：#food>span,#food>p

3、选择id为food的所有子元素：#food>*

 

3、兄弟节点选择:

• 二者有相同的父元素，且一个元素紧接在另一个元素后面，用 +

　　比如：#food+div 　　　　#many>div>p.special+p　　兄弟元素，且紧接在后面

• 二者有相同的父元素，一个元素在另一个元素的后面（不一定需要紧邻），用 ~

　　比如：#food~div 兄弟元素，但不一定紧接后面

 

4、属性选择器：可以根据元素的属性及属性值来选择元素

• *[style]　　
• p[spec=len2]　　
• p[spec=‘len3 len4‘] #有特殊字符空格，需要加引号　　
• p[spec*=‘len2‘]  #包含，包含len2就被取到　　
• p[spec^=‘len2‘]  #开头，以len2开头就被取到 　　
• p[spec$=‘len2‘]  #结尾，以len2结尾就被取到　　
• p[class=special][name=p1]  #通过多个属性来定位

5、伪类

• ：nth-child(n)  #选择的元素必须在指定的位置，n从1开始,正向数　　.food p:nth-child(1)  #class为food的第一个后代元素，且标签为p，如果第一个不是p，则取不到
• ：nth-last-child(n)  #选择的元素必须在指定的位置，n从1开始，倒数
• ：nth-of-type(n)  #不要求是第几位，只要是第几个出现的就可以，n从1开始,正向数　　.food p:nth-of-type(1)  #class为food的后代元素中标签为p的第一个元素，若用*则可能取到多个
• ：nth-last-of-type(n)  #不要求是第几位，只要是第几个出现的就可以，n从1开始，倒数

6、验证CSS选择器

• 在element内，ctrl+f 查找
• 在console内，$$(‘......‘) 查找

 

3、xpath

1、选择元素的方法

// :后代元素     /：子元素　　//*[@class="name"]

 

2、组选择(根据多个属性定位)

//p[@class="name"][@class="age"]

 

3、子元素选择

• 选择属于其父元素的第N个类型的子元素

　　　　//*[@id="food"]/p[1]　　等价于 #food>p:nth-of-type(1)

• 选择属于其父元素的倒数第N个某个类型的子元素

　　　　//span[last()-1]　　属于其父元素的倒数第二个span

　　　　//*[@id="food"]/span[last()]　　id为food下的倒数第一个span元素

• 选择属于其父元素的第N个子元素（基于所有类型元素）

　　　　//*[2]　　等价于 //*[position()=2]

　　　　//*[@id="food"]/*[position()=3]

• 支持其他的 比较操作符

　　　　//*[@id="food"]/*[position()<3]

　　　　//*[@id="food"]/*[position()<=3]

• 选择属于其父元素的倒数第N个子元素

　　　　//*[@id="food"]/*[last()-1] 　　等价于 //*[@id="food"]/*[position()=last()-1]

　　　　多选 //*[@id="food"]/*[position()>last()-3]

• 选择中间部分的子元素(范围）

　　　　//*[@id="food"]/*[position()>1][position()<last()]  或者  //*[@id="food"]/*[position()>1 and position()<last()]

• 选择两端的子元素

　　　　//*[@id="food"]/*[position()<=1 or position()>=last()]

 

 4、属性选择器：可以根据元素的属性及属性值来选择元素

//span[contains(@class,"name")]　　#包含

//span[starts-with(@class,"name")]　　#开头

#结尾---浏览器未实现，只能用css

 

5、相邻兄弟选择器

//*[@id="food"]/following-sibling::div　　选择id=food的后面的兄弟div元素（多个）

//*[@id="food"]/following-sibling::div[1]　　选择id=food的后面的兄弟div元素中的第一个，下标从1开始

//*[@id="food"]/preceding-sibling::div　　选择id=food的前面的兄弟div元素（多个）

//*[@id="food"]/preceding-sibling::div[1]　　选择id=food的前面的兄弟div元素中的离的最近的一个，下标从1开始，下标越大，距离越远

 

6、父元素 ..

//*[@id="food"]/..　　选择id=food的父元素

 

7、局部查找 .//

es=ele.find_elenments_by_xpath(‘.//span‘)　　#相对路径，前面需要加点 . 

 

操作界面元素

1、输入操作：点击、输入文字、拖拽

driver.back()　　#后退

driver.forward()　　#前进

driver.refresh()　　#刷新

driver.get_screenshot_as_file(r‘D:aidu.png‘)　　#页面截图，保存路径为D:aidu.png，注意图片格式为png

ele.screenshot(r‘D:aidu2.png‘)　　#元素截图，先定位元素，后根据元素截图，保存路径为D:aidu2.png，注意图片格式为png

driver.maximize_window()　　#最大化

driver.minimize_wndow()　　#最小化

driver.set_window_size(800,600)　　#设置指定的尺寸大小

 

2、输出操作：获取元素的各种属性

text属性：显示该元素在web页面显示出来的文本内容

get_attribute方法

　1、某个属性的值

　　ele.get_attribute(‘href‘)　　#获取属性href的值

　2、该元素对应html源代码  　　#等于本身+内部部分↓

　　ele.get_attribute(‘outerHTML‘)

　3、该元素的内部部分的HTML源代码

　　ele.get_attribute(‘innerHTML‘)

print(driver.title) ：获取网页的标题，即head里的title里的文本信息

print(driver.current_url) ：获取当前窗口的url

获取窗口尺寸：

size=driver.get_window_size()
print(f‘高度{size["height"]},宽度{size["width"]}‘)

获取元素尺寸：

e_size=ele.size
print(f‘高度{e_size["height"]},宽度{e_size["width"]}‘)

获取窗口位置（窗口左上角坐标）：

loc=driver.get_window_position()
print(f‘坐标x:{loc["x"]},y:{loc["y"]}‘)

获取元素坐标（元素左上角坐标）：

e_loc=ele.location
print(f‘元素坐标是x:{e_loc["x"]},y:{e_loc["y"]}‘)

 

3、文本框操作

ele.send_keys(‘你好‘)　　#输入

ele.clear()　　#清除

ss=ele.get_attribute(‘value‘)　　#获取文本框内的文本

 

4、单选框操作（type为radio类型）

ele.click()　　#点击，即为选择操作

ele.is_selected()　　#判断是否被选中，结果为True或False

 

5、多选框（type为checkbox）

ele.click()　　#点击，即为选择操作，操作前需要先获取选择状态

ele.is_selected()　　#判断是否被选中，结果为True或False

 

6、select选择框（标签为select） multiple代表可多选，没有则只能单选

先导入类：from selenium.webdriver.support.select import Select

参数化：sel=Select(se)

调用方法：

sel.select_by_visible_text(‘自行车‘)　　#选择‘自行车’

sel.deselect_by_visible-text(‘火车‘)　　#取消选择‘火车’

sel.select_by_index(0)　　#选择第一个，下标从0开始

sel.deselect_all()　　#全部取消选择

ops=sel.all_selected_options    #返回所有被选择的元素

for op in ops:

    print(op.text)    打印元素文本