Selenium之css定位

css概述：

它是Selenium中的一种定位剂，通过它我们可以识别网页上的Web元素。CSS代表级联样式表，用于样式化HTML网页的不同元素。CSS选择器定位器始终是在网页上定位元素的最佳方法。不论浏览器如何，CSS始终相同。css定位方法：find_element_by_css_selector()

css几种定位方式

1：id选择器

说明：根据元素id属性来选择

格式：#id属性值 如：#userA(选择id属性值为userA的所有元素)

示例：打开百度首页，通过css定位，id属性来输入搜索关键字

from selenium import webdriver
import time
# 打开chrome浏览器
driver = webdriver.Chrome()
# 打开百度搜索页面
driver.get('https://www.baidu.com')
# 通过css id属性来定位
driver.find_element_by_css_selector('#kw').send_keys('selenium')
# 强制等待2秒查看效果
time.sleep(2)
# 关闭浏览器
driver.quit()

2：class选择器

说明：根据元素class属性来选择

格式：.class属性值 如：.telA(选择class属性值为telA的所有元素)

示例：打开百度首页，通过css定位，class属性来输入搜索关键字

from selenium import webdriver
import time
# 打开chrome浏览器
driver = webdriver.Chrome()
# 打开百度搜索页面
driver.get('https://www.baidu.com')
driver.find_element_by_css_selector('.s_ipt').send_keys('hello python')
# 强制等待2秒查看效果
time.sleep(2)
# 关闭浏览器
driver.quit()

3：属性选择器

说明：根据元素的属性名和值来选择

格式：[attribute=value] 如：[type=‘password’]（选择所有type属性为password的值）

示例：打开百度首页，通过css定位，属性选择器来输入搜索关键字

from selenium import webdriver
import time
# 打开chrome浏览器
driver = webdriver.Chrome()
# 打开百度搜索页面
driver.get('https://www.baidu.com')
driver.find_element_by_css_selector('[name="wd"]').send_keys('你好，python')
# 强制等待2秒查看效果
time.sleep(2)
# 关闭浏览器
driver.quit()

4：层级选择器

说明：根据元素的父子关系来选择

格式：element>element 如：p>input（返还所有P元素下所有的input元素）

提示：>可以用空格代替，如：p input或者 p [type=‘password’]

示例：打开百度首页，通过css定位，层级选择器来输入搜索关键字

from selenium import webdriver
import time
# 打开chrome浏览器
driver = webdriver.Chrome()
# 打开百度搜索页面
driver.get('https://www.baidu.com')
# 通过css 层级选择器定位
driver.find_element_by_css_selector('form > span > input').send_keys('层级属性')
# 强制等待2秒查看效果
time.sleep(2)
# 关闭浏览器
driver.quit()

5：通过绝对路径定位

什么是绝对路径？绝对路径其实就是从开始标签（html）一级一级找到目标元素，上下级元素分隔符为>或者空格

例如：通过css绝对路径定位百度输入框，并输入内容检索，代码如下：

from selenium import  webdriver
　　import time
　　# 打开浏览器
　　driver=webdriver.Chrome()
　　# 加载项目地址（百度）
　　driver.get("http://www.baidu.com")
　　time.sleep(3) 
　　#定位百度输入框
　　driver.find_element_by_css_selector("html body div div div div div form span input").send_keys("小龙女")
　　driver.find_element_by_css_selector("html>body>div>div>div>div>div>form>span>input").send_keys("小龙女")

学习安排上

如果你不想再体验一次学习时找不到资料，没人解答问题，坚持几天便放弃的感受的话，在这里我给大家分享一些自动化测试的学习资源，希望能给你前进的路上带来帮助。

视频文档获取方式：

这份文档和视频资料，对于想从事【软件测试】的朋友来说应该是最全面最完整的备战仓库，这个仓库也陪伴我走过了最艰难的路程，希望也能帮助到你！以上均可以分享，点下方小卡片进群即可自行领取。