写点什么

selenium 相对定位器

作者:Cindy
  • 2022 年 3 月 03 日
  • 本文字数:1690 字

    阅读完需:约 6 分钟

selenium相对定位器

前言

selenium 提供的定位方法有很多,先回顾一下


  1. 使用 id 定位

  2. 使用 name 定位

  3. 使用 class name 定位

  4. 使用 tag name 定位

  5. 使用链接文字定位

  6. 使用链接的部分文字定位

  7. 使用 xpath 定位

  8. 使用 class 定位

  9. 使用 find_element("locator", "value"), 这个 locator 只支持 id, name, xpath, css

  10. 使用 find_elements_xxl 来定位到组元素,再通过下标来找到想要定位的元素


selenium4 又新增了一个相对定位

selenium 相对定位

selenium4 新增了一个相对定位器,来帮助用户查找元素附近的其他元素。它提供的相对定位器有如下:


  • above

  • below

  • toLeftOf

  • toRightOf

  • near 在 selenium4 中,find_element 方法可以支持 locator=withTagName, 它返回了一个关联定位器我们通过例子来说明


我们有一个登陆页面,例如百度登陆页面



页面上有三个元素,用户名,密码输入框和一个登陆按钮

above 方法

该方法用来返回指定元素上方的元素。例如我们可以先定位到密码输入框,直接上代码


from selenium.webdriver.support.relative_locator import with_tag_namefrom selenium import webdriverfrom webdriver_manager.chrome import ChromeDriverManagerfrom selenium.webdriver.common.by import Byimport timedriver = webdriver.Chrome(ChromeDriverManager().install())driver.get("https://passport.baidu.com/v2/?login&u=https%3A%2F%2Fwww.baidu.com%2Fmy%2Findex")time.sleep(2)#TANGRAM__PSP_3__footerULoginBtndriver.find_element_by_id("TANGRAM__PSP_3__footerULoginBtn").click()time.sleep(2)password = driver.find_element(By.ID, "TANGRAM__PSP_3__password") #TANGRAM__PSP_3__passwordemail_address = driver.find_element(with_tag_name("input").above(password))email_address.send_keys("hong mao dan")
time.sleep(120)
复制代码


执行结果,用户名输入框正确输入了 hong mao dan


below 方法

顾名思义,就是查找定位元素下方的元素,那我们可以反推,先定位到用户名输入框,再通过 below 方法找到密码输入框还是上代码


email_input = driver.find_element(By.ID, "TANGRAM__PSP_3__userName")password_input = driver.find_element(with_tag_name("input").below(email_input))password_input.send_keys("it's a secret")
复制代码


执行结果,密码已经输入进去了


toLeftOf 方法

这个也很好理解,就是找到定位到元素的左边的元素,我们换个页面,来看下百度这个主页面,上面有一排新闻 hao123, 地图,链接等 tab,我们先定位到图片 tab, 再通过 toLeftOf 方法方法找到视频 tab



上代码


driver.get("https://www.baidu.com/")image_tab = driver.find_element(By.PARTIAL_LINK_TEXT, "图片")video_tab = driver.find_element(with_tag_name("a").to_left_of(image_tab))video_tab.click()
复制代码


执行结果,看已经正确跳转到了视频页面,看到了俄罗斯和乌克兰的战争,敏感的战争政治话题就不讨论了


toRightOf 方法

左边完事了,那就看右边的,所以我们翻过来,找到视频链接的元素,再根据 right 方法去找图片 tab 上代码


video_tab = driver.find_element(By.PARTIAL_LINK_TEXT, "视频")image_tab = driver.find_element(with_tag_name("a").to_right_of(video_tab))image_tab.click()
复制代码


执行结果


near 方法

那最后再看看 near 方法


该方法用来返回指定元素附近的元素,最远的距离是 50 像素


那我们根据图片链接元素,看能不能定位到百度输入框上代码


video_tab = driver.find_element(By.PARTIAL_LINK_TEXT, "视频")# image_tab = driver.find_element(with_tag_name("a").to_right_of(video_tab))# image_tab.click()baidu_input = driver.find_element(with_tag_name("input").to_right_of(video_tab))baidu_input.send_keys("hello world")
复制代码


执行结果


结语

相对定位其实是 selenium4 使用 javascript 的 getBoundingClientRect 方法来查找关联元素,这个方法会返回元素的属性,例如 right,left,bottom,top。本文介绍的例子都相对简单,实际项目中元素定位往往很复杂,比如这个相对定位用的都是 with_tag_name 方法,如果这个 tag,元素附近有很多相同的怎么办,它指定的是哪一个呢, 所以定位方法有多种多样,需要我们根据实际情况灵活应用。

发布于: 刚刚阅读数: 2
用户头像

Cindy

关注

还未添加个人签名 2022.01.26 加入

还未添加个人简介

评论

发布
暂无评论
selenium相对定位器_3月程序媛福利_Cindy_InfoQ写作平台