selenium之name和class_name定位

本文介绍Selenium中name和class_name定位方法的应用实例,通过具体案例演示如何使用这两种方法进行网页元素定位,包括输入用户名、密码等操作。

一、name定位

1、说明:name定位就是根据元素name属性来定位(前提是有name属性)

2、name定位方法:

element=driver.find_element_by_name(name)

3、案例:打开Iconfont的登录界面,完成以下操作:

  1. 使用name定位,输入用户名:admin
  2. 使用name定位,输入密码:124132432
  3. 10秒后关闭浏览器窗口

代码如下:

from selenium import webdriver
from time import sleep

#这里使用阿里Iconfont的登录界面

#获取浏览器对象
driver=webdriver.Chrome()
#获取网络链接
url="https://login.alibaba-inc.com/ssoLogin.htm?BACK_URL=https%3A%2F%2Fwww.iconfont.cn%2Fapi%2FsendBucSSOToken.do&preLoginKey=HQbkPavlaI1572415135309WAbvcSruKi&CLIENT_VERSION=0.3.7&CONTEXT_PATH=%2Fapi&APP_NAME=icon-font&CANCEL_CERT=true"
driver.get(url)
#获取用户名元素和密码元素,用户名输入admin,密码输入123241234
driver.find_element_by_name("domainAccount").send_keys("admin")
driver.find_element_by_name("password").send_keys("123241234")
#暂停3秒
sleep(3)
#退出浏览器驱动
driver.quit()

运行效果:

二、class_name定位

1、说明:class_name定位就是根据元素class属性值来定位元素。HTML通过使用class来定义元素的样式。

前提:元素有class属性。

注意:如果class有多个属性值,只能使用其中的一个。

2、class_name定位方法

element=driver.find_element_by_class_name(class_name)

3、案例:打开几案网的登录界面,完成以下操作:

  1. 使用class_name定位,输入手机号:17862088887
  2. 使用class_name定位,输入密码:124132432
  3. 3秒后关闭浏览器窗口

代码如下:

from selenium import webdriver
from time import sleep

#这里使用几案网的登录界面

#获取浏览器对象
driver=webdriver.Chrome()
#获取网络链接
url="http://www.ji-an.com/user/index/login"
driver.get(url)
#获取手机号码元素和密码元素,用户名输入手机号,密码输入123241234
driver.find_element_by_class_name("form-control").send_keys("17862088887")
driver.find_element_by_class_name("password").send_keys("123241234")
#暂停3秒
sleep(3)
#退出浏览器驱动
driver.quit()

运行效果:

在使用 Selenium 进行元素定位时,通过 `class_name` 定位是一种常见方式,但有时会遇到无法通过 `class_name` 成功定位元素的问题。这通常与 HTML 中的 class 属性结构、动态生成的 class 名称或元素尚未加载完成等因素有关。 ### 常见原因及解决方法 #### 1. **class 名称中包含空格** HTML 中的 `class` 属性可以包含多个类名,以空格分隔。如果目标元素的 `class` 属性中包含多个类名,例如 `class="form-control input-lg"`,使用 `find_element_by_class_name("form-control input-lg")` 会失败,因为 `find_element_by_class_name` 方法仅接受单个类名作为参数。 **解决方法:** 使用 CSS 选择器或 XPath 来精确匹配多个类名: ```python # 使用 CSS 选择器 driver.find_element_by_css_selector(".form-control.input-lg") ``` #### 2. **class 名称是动态生成的** 在现代前端框架(如 React、Vue)中,class 名称常常是动态生成的,例如 `class="abc123"`,这使得直接使用 `class_name` 定位变得不可靠。 **解决方法:** 改用 CSS 选择器或 XPath 结合部分匹配: ```python # 使用 CSS 选择器的部分匹配 driver.find_element_by_css_selector("[class*='abc']") ``` #### 3. **元素尚未加载完成** 如果在页面加载完成之前尝试定位元素,可能会导致定位失败。 **解决方法:** 使用显式等待(Explicit Wait)确保元素加载完成后再进行操作: ```python from selenium.webdriver.common.by import By from selenium.webdriver.support.ui import WebDriverWait from selenium.webdriver.support import expected_conditions as EC # 等待元素可见 element = WebDriverWait(driver, 10).until( EC.visibility_of_element_located((By.CLASS_NAME, "form-control")) ) element.send_keys("test") ``` #### 4. **多个相同 class 名称的元素存在** 如果页面中存在多个具有相同 class 名称的元素,`find_element_by_class_name` 会返回第一个匹配的元素,可能不是预期的目标。 **解决方法:** 使用 `find_elements_by_class_name` 获取元素列表后进行筛选: ```python elements = driver.find_elements_by_class_name("form-control") for element in elements: if element.is_displayed(): element.send_keys("test") break ``` #### 5. **使用了不支持的定位方式** Selenium 的 `find_element_by_class_name` 方法在某些浏览器或驱动版本中可能存在兼容性问题。 **解决方法:** 改用通用的 `find_element` 方法并指定定位策略: ```python from selenium.webdriver.common.by import By element = driver.find_element(By.CLASS_NAME, "form-control") ``` ### 示例代码 以下是一个完整的示例代码,展示了如何使用显式等待 CSS 选择器来更可靠地定位元素: ```python from selenium import webdriver from selenium.webdriver.common.by import By from selenium.webdriver.support.ui import WebDriverWait from selenium.webdriver.support import expected_conditions as EC # 初始化浏览器驱动 driver = webdriver.Chrome() # 打开目标网页 driver.get("https://www.example.com") # 等待 class 为 "form-control" 的元素可见 element = WebDriverWait(driver, 10).until( EC.visibility_of_element_located((By.CSS_SELECTOR, ".form-control")) ) # 输入文本 element.send_keys("test") # 关闭浏览器 driver.quit() ``` ###
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值