目录
[1.1 CSS定位](#1.1 CSS定位)
[1.1.1 绝对路径定位](#1.1.1 绝对路径定位)
[1.1.2 相对路径定位](#1.1.2 相对路径定位)
[1.1.3 类名定位](#1.1.3 类名定位)
[1.1.4 属性定位](#1.1.4 属性定位)
[1.1.4.1 ID属性定位](#1.1.4.1 ID属性定位)
[1.1.4.2 其他属性定位](#1.1.4.2 其他属性定位)
[1.1.4.3 模糊属性定位](#1.1.4.3 模糊属性定位)
[1.1.5 子页面元素查找](#1.1.5 子页面元素查找)
[1.1.6 伪类定位](#1.1.6 伪类定位)
[1.1 CSS伪类](#1.1 CSS伪类)
1.1 CSS定位
1.1.1 绝对路径定位
目标
查找第一个文本为"猜猜看"的a标签
实现
CSS表达式
html>body>div>a[.="猜猜看"]
python表达式
driver.find_element_by_css_selector('html>body>div>a[.="猜猜看"]')
1.1.2 相对路径定位
目标
查找第一个文本为"猜猜看"的a标签
实现
CSS表达式
a[.="猜猜看"]
Python表达式
driver.find_element_by_css_selector('a[.="猜猜看"]')
1.1.3 类名定位
目标
查找第一个类名为"blogpost-body"的div元素
实现
CSS表达式
div. blogpost-body
python表达式
driver.find_element_by_css_selector("div. blogpost-body")
说明
对于复合class,如<input class="btn btn-lg btn-default" type="text">,直接写上所有的class即可,即:driver.find_element_by_css_selector("input. btn.btn-lg.btn-default")
标签名不是必须的
1.1.4 属性定位
1.1.4.1 ID属性定位
目标
查找页面中第一个id为"cnblogs_post_body"div元素
实现
CSS表达式
div# cnblogs_post_body
Python表达式
driver.find_element_by_css_selector("div# cnblogs_post_body")
1.1.4.2 其他属性定位
其他属性是指除id、class以外的所有属性,如img的src、alt属性,input的type、placeholder等
目标
查找页面中alt属性等于"点我试试呀"的img元素
实现
CSS表达式
img[alt="点我试试呀"]
Python表达式
driver.find_element_by_css_selector('img[alt="点我试试呀"]')
说明
如果单独依靠某个属性无法唯一定位元素,则可以写多个属性,如下:
img[alt="点我试试呀"][src="/images/bg.jpg"]
driver.find_element_by_css_selector('img[alt="点我试试呀"] [src="/images/bg.jpg"]')
1.1.4.3 模糊属性定位
模糊属性定位经常使用的三个正则表达式^、$、*
目标
查找链接地址是"http://www.baidu.com"的a标签
CSS表达式
a[href^="http://www.baidu"]
a[href$="baidu.com"]
a[href*="baidu"]
python表达式
find_element_by_css_selector('a[href^="http://www.baidu"]')
find_element_by_css_selector('a[href^=" a[href$="baidu.com"]')
find_element_by_css_selector('a[href*="baidu"]')
1.1.5 子页面元素查找
目标
查找id为home的div下的class为highlighter-rouge的div
CSS表达式
div#home>div.highlighter-rouge
python表达式
driver.find_element_by_css_selector("div#home>div.highlighter-rouge")
1.1.6 伪类定位
目标
查找div#home下的第一个子元素
CSS表达式
div#home :first-child
python表达式
dirver..find_element_by_css_selector("div#home :first-child")
附录:
CSS伪类
1.1 CSS伪类
|-------------------------------------------------------------------------------------------------------|-----------------------|------------------------------|
| 选择器 | 示例 | 示例说明 |
| :checked | input:checked | 选择所有选中的表单元素 |
| :disabled | input:disabled | 选择所有禁用的表单元素 |
| :empty | p:empty | 选择所有没有子元素的p元素 |
| :enabled | input:enabled | 选择所有启用的表单元素 |
| :first-of-type | p:first-of-type | 选择每个父元素是p元素的第一个p子元素 |
| :in-range | input:in-range | 选择元素指定范围内的值 |
| :invalid | input:invalid | 选择所有无效的元素 |
| :last-child | p:last-child | 选择所有p元素的最后一个子元素 |
| :last-of-type | p:last-of-type | 选择每个p元素是其母元素的最后一个p元素 |
| :not(selector) | :not(p) | 选择所有p以外的元素 |
| :nth-child(n) | p:nth-child(2) | 选择所有 p 元素的父元素的第二个子元素 |
| :nth-last-child(n) | p:nth-last-child(2) | 选择所有p元素倒数的第二个子元素 |
| :nth-last-of-type(n) | p:nth-last-of-type(2) | 选择所有p元素倒数的第二个为p的子元素 |
| :nth-of-type(n) | p:nth-of-type(2) | 选择所有p元素第二个为p的子元素 |
| :only-of-type | p:only-of-type | 选择所有仅有一个子元素为p的元素 |
| :only-child | p:only-child | 选择所有仅有一个子元素的p元素 |
| :optional | input:optional | 选择没有"required"的元素属性 |
| :out-of-range | input:out-of-range | 选择指定范围以外的值的元素属性 |
| :read-only | input:read-only | 选择只读属性的元素属性 |
| :read-write | input:read-write | 选择没有只读属性的元素属性 |
| :required | input:required | 选择有"required"属性指定的元素属性 |
| :root | root | 选择文档的根元素 |
| :target | #news:target | 选择当前活动#news元素(点击URL包含锚的名字) |
| :valid | input:valid | 选择所有有效值的属性 |
| :link | a:link | 选择所有未访问链接 |
| :visited | a:visited | 选择所有访问过的链接 |
| :active | a:active | 选择正在活动链接 |
| :hover | a:hover | 把鼠标放在链接上的状态 |
| :focus | input:focus | 选择元素输入后具有焦点 |
| :first-letter | p:first-letter | 选择每个<p> 元素的第一个字母 |
| :first-line | p:first-line | 选择每个<p> 元素的第一行 |
| :first-child | p:first-child | 选择器匹配属于任意元素的第一个子元素的 <p> 元素 |
| :before | p:before | 在每个<p>元素之前插入内容 |
| :after | p:after | 在每个<p>元素之后插入内容 |
| :lang(language) | p:lang(it) | 为<p>元素的lang属性选择一个开始值 |
import os,time
from selenium import webdriver
driver = webdriver.Chrome()
driver.get('https://www.baidu.com')
driver.maximize_window()
time.sleep(2)
#1、绝对路径
driver.find_element_by_css_selector('html body div div div+div+div a+a+a').click()
#2、相对路径
driver.find_element_by_css_selector('div div div+div+div a+a+a').click()
#3、元素属性定位 class用. id用#
driver.find_element_by_css_selector('input#kw').send_keys('丸子')
driver.find_element_by_css_selector('input.s_ipt').send_keys('丸子')
#单个属性写法
driver.find_element_by_css_selector('input[maxlength="255"]').send_keys('丸子')
#多属性写法(与xpath不同,没有or用法)
driver.find_element_by_css_selector('input[maxlength="255"][name="wd"]').send_keys('丸子')
#使用部分属性值匹配
#以什么开头 ^=
driver.find_element_by_css_selector('a[href^="http://news"]').click()
#以什么结尾$=
driver.find_element_by_css_selector('a[href$="hao123.com"]').click()
#属性值包含 *=
driver.find_element_by_css_selector('a[href*="tieba"]').click()
#查询子元素 >和空格效果一致
#第一个子元素
driver.find_element_by_css_selector('div.s-top-left a').click()
driver.find_element_by_css_selector('div.s-top-left a:first-child').click()
#最后一个元素
driver.find_element_by_css_selector('div.s-bottom-layer-content p:last-child').click()
#第N个子元素
driver.find_element_by_css_selector('div.s-top-left a:nth-child(3)').click()
#查询兄弟元素
#p~p:表示从第二个p元素开始取到末尾
p_lable = driver.find_elements_by_css_selector('div.s-bottom-layer-content p~p')
print(len(p_lable))
for i in p_lable:
print(i.text) #输出每一个p标签的text
#从第一个取到末尾,先定位到第一个p标签,然后获取每一个p标签的值【报错】
p_lable = driver.find_element_by_css_selector('div.s-bottom-layer-content').find_elements_by_tag_name('p')
print(len(p_lable))
for i in p_lable:
print(i.text) #输出每一个p标签的text
#新的定位语法
from selenium.webdriver.common.by import By
driver.find_element(By.NAME,'wd').send_keys('丸子')
time.sleep(3)
driver.quit()
==========
定位一组元素中最后一个:div.result-item.ng-star-inserted:last-child
或者:div.result-item.ng-star-inserted:nth-last-of-type(1) div:nth-child(2)
倒数第三个:div.result-item.ng-star-inserted:nth-last-of-type(3) div:nth-child(2)
===========
以下是我收集到的比较好的学习教程资源,虽然不是什么很值钱的东西,如果你刚好需要,可以评论区,留言【777】直接拿走就好了
各位想获取资料的朋友请 点赞 + 评论 + 收藏 ,三连!
三连之后我会在评论区挨个私信发给你们~