元素定位
1、 一般元素定位方式
示例网页:
......
<inputtype="text"class="s_ipt"name="wd"id="kw"maxlength="100"autocomplete="off"><ahref="http://tieba.baidu.com/"target="_blank"class="mnav c-font-normal c-color-t">贴吧</a><ahref="https://wenku.baidu.com/?fr=bdpcindex"target="_blank"class="mnav c-font-normal c-color-t">一个文本很长的超链接</a>
......
- 通过id定位:
driver.find_element_by_id("kw")
- 通过name定位 :
driver.find_element_by_name("wd")
- 通过class定位 :
driver.find_element_by_class_name("s_ipt")
- 通过tag定位:
driver.find_element_by_tag_name("input")
tag指标签<input>、<div>、<a>
等 - 通过link定位 :
driver.find_element_by_link_text("贴吧")
- 通过partical link定位 :
driver.find_element_by_partical_link_text("一个文本")
2、通过xpath定位
2.1 绝对路径定位
原理: 类似通过xx省xx市xx区xx路xx号来定位一个人的住址,实际是通过dom树结构定位元素位置
语法:
driver.find_element_by_xpath("/html/body/div/div[2]/div/div/div/from/span/input")
说明:
/
表示层级关系,
div[2]
表示第2个div
2.2 利用元素属性定位
原理:通过元素的属性值来定位元素
语法:
find element by_xpath("//input[@id='kw']")
find element by_xpath("//input[@maxlength='100']")
find element by _xpath("//input[@autocomplete='off]")
find element by xpath("//input[@name='wd']")
find element by xpath("//*[@class='bg s btn']")
说明:
//input
表示当前页面的某个目录下的input标签[@id='kw']
使用属性id ,对应的属性值是 kw//*
不指定标签名,在所有标签中查找
2.3 层级和属性结合定位
原理:某些元素没有特殊的属性可以定位,可以先通过属性定位他的父级元素,然后再通过层级关系定位到这个元素
<formclass="numberform"><inputvalue="ejxjdsjjsssddn"><inputvalue="ssmkdlfnskslss"></form>
通过form父元素定位子元素中的第二个input :
driver.find_elment_by_xpath('//form[@class="numberform"]/input[2]')
2.4 使用逻辑运算符定位
<inputclass="listitem"name="z1"><inputclass="listitem"name="z1"><inputclass="listitem"name="z2">
通过
and
连接两个属性来定位元素
driver.find_elment_by_xpath('//input[@class="listitem" and @name="z2"])
3、通过css定位元素
- 通过id定位:
driver.find_element_by_css_selector("#kw")
- 通过class定位 :
driver.find_element_by_css_selector(".s_ipt")
- 通过tag定位:
driver.find_element_by_css_selector("form>input")
- 通过属性定位:
driver.find_element_by_css_selector("[name='kw']")
- 组合定位:
find element by_css selector("span.s_ipt>input.s_ip")
定位标签为span class=s_ipt下的input标签,且input标签的class= s_ip
xpath和css定位对比
定位方式xpathcss标签//divdivby_id//div[@id=‘elid’]div#elidby_class//div[@class=‘elclass’]div.elclass属性//div[@title=‘move mouse here’]div[title=Move mouse here] 或 div{title^=Move] 或div[title$=here] 或 div[title*=mouse]定位子元素//div/parent/childdiv>parent>child
4、通过By 定位元素
通过By定位元素其实是针对以上三种方式的整合,其原理不变,使用示例如下:
from selenium.webdriver.common.by import By
driver.find_element(By.ID,"kw")
driver.find_element(By.NAME,"wd")
driver.find_element(By.CLASS NAME,"'s ipt")
driver.find_element(By.TAG NAME,"input")
driver.find_element(By.LINK TEXT,"新闻")
driver.find_element(By.PARTIAL LINK TEXT,"新")
driver.find_element(By.XPATH,"//*[@class='bg s btn']")
driver.find_element(By.CSS SELECTOR,"span.bg s btn wr>input#su")
5、定位一组元素
定位一组元素与定位一个元素的方式类似
- 单个元素定位:
driver.find_element_by_xx
- 多个元素定位:
driver.find_elements_by_xx
示例:
定位单个元素定位一组元素driver.find_element_by_class_name(“s_ipt”)driver.find_elements_by_class_name(“s_ipt”)driver.find_element_by_xpath(“//[@class=‘bg’]”)find_elements_by_xpath(“//[@class='bg]”)driver.find_element_by_css_selector(“[name=‘kw’]”)driver.find_elements_by_css_selector(“[name=‘kw’]”)driver.find_element(By.CLASS NAME,“'s ipt”)driver.find_elements(By.CLASS NAME,“'s ipt”)
对一组元素进行操作,如选中下拉控件的每一个元素
html如下:
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width, initial-scale=1.0"><title>多选控件示例</title></head><body><h2>请选择您喜欢的水果:</h2><form><inputtype="checkbox"id="apple"name="fruits"value="apple"><labelfor="apple">苹果</label><br><inputtype="checkbox"id="banana"name="fruits"value="banana"><labelfor="banana">香蕉</label><br><inputtype="checkbox"id="orange"name="fruits"value="orange"><labelfor="orange">橙子</label><br><inputtype="submit"value="提交"></form></body></html>
定位input ,它们有共同的name:fruits
import os
from selenium import webdriver
from selenium.webdriver.common.by import By
# 访问本地html
driver = webdriver.Chrome()
file_path ='file:///'+ os.path.abspath('checkbox.html')
driver.get(file_path)# 定位一组checkbox
checkboxs = driver.find_elements(By.XPATH,'//input[@name="fruits"]')# 遍历一组元素,对每个元素进行点击for checkbox in checkboxs:
checkbox.click()
6、浏览器自带的元素辅助定位功能:
chrome、edage、firefox 浏览器支持选中元素右键–>检查–>在html源码页面选中元素–>右键–>复制–>
- 复制xpath
- 复制完整xpath
- 复制selector
版权归原作者 青格er 所有, 如有侵权,请联系我们删除。