Selenium基础 — CSS选择器定位大全
1、css属性定位
| css选择器策略 | 示例 | 说明 |
|---|---|---|
| #id | #telA | 选择id="telA"的所有元素。 |
| .class | .telA | 选择 class="telA”的所有元素。 |
| [属性名=属性值] | [name=telA] | 除了id和class属性，其他属性的定位格式 |
| [attribute] | [target] | 选择带有target 属性所有元素。 |
| * | * | 选择所有元素。 |
2、css属性值模糊匹配定位
| css选择器策略 | 示例 | 说明 | ||
|---|---|---|---|---|
| [attribute^=value] | a[src^="https"] | 选择其src 属性值以"https”开头的每个<a>元素。 | ||
| [attribute$=value] | a[src$=".pdf"] | 选择其src属性以".pdf“结尾的所有<a>元素。 | ||
| [attribute*=value] | a[src*="abc"] | 选择其src 属性中包含“abc"子串的每个<a>元素。 | ||
| [attribute~=value] | a[title~=flower] | 定位标签属性title值中有独立flower词汇的节点 | ||
| [attribute | =value] | a[lang | =en] | 用于选取带有以指定值开头的属性值的元素。 |
注意：[attribute|=value]
该值必须是整个单词，比如 lang="en"，或者后面跟着连字符，比如 lang="en-us"。
3、css标签定位
| css选择器策略 | 示例 | 说明 |
|---|---|---|
| element | p | 定位所有<p>元素。 |
| 标签名[属性名=属性值] | input#telA | 定位id属性值为telA的所有<input>元素 |
4、css层级关系定位
| css选择器策略 | 示例 | 说明 |
|---|---|---|
| element,element | div,p | 选择所有 <div> 元素和所有 <p> 元素。 |
| element element | div p | 选择 <div> 元素内部的所有 <p> 元素。包括子孙后代。 |
| element>element | div>p | 选择父元素为 <div> 元素的所有 <p> 元素。只包括子代。 |
| element+element | div+p | 选择紧接在 <div> 元素之后的所有 <p> 元素。同辈元素。 |
示例：
| css选择器策略 | 示例 | 说明 |
|---|---|---|
| 需要使用 > 或 空格表示层级关系 | 语法 | |
| 父标签名[父标签属性名=属性值]>子标签名 | p#p1>input | 定位id属性值为p1的<input>元素 |
| 父标签名[父标签属性名=属性值] 子标签名 | p#p1 input | 同上 |
5、css索引定位
| css选择器策略 | 示例 | 说明 |
|---|---|---|
| :only-child | p:only-child | 选择属于其父元素的唯一子元素的每个 <p> 元素。 |
| :nth-child(n) | p:nth-child(2) | 选择属于其父元素的第二个子元素的每个 <p> 元素。 |
| :nth-last-child(n) | p:nth-last-child(2) | 同上，从最后一个子元素开始计数。 |
| :nth-of-type(n) | p:nth-of-type(2) | 选择属于其父元素第二个 <p> 元素的每个 <p> 元素。 |
| :nth-last-of-type(n) | p:nth-last-of-type(2) | 同上，但是从最后一个子元素开始计数。 |
6、css逻辑运算定位
| css选择器策略 | 逻辑定位 | |
|---|---|---|
| 示例 | 标签名[属性名1=属性值1][属性名2=属性值2] | |
| 示例 | input[type='telA'][placeholder='电话A'] | |
| 说明 | 同时匹配多个属性 |
7、css元素状态定位
| 选择器 | 例子 | 例子描述 |
|---|---|---|
| :empty | p:empty | 选择没有子元素的每个 <p> 元素（包括文本节点）。 |
| :target | #news:target | 选择当前活动的 #news 元素。 |
| :enabled | input:enabled | 选择每个启用的 <input> 元素。 |
| :disabled | input:disabled | 选择每个禁用的 <input> 元素 |
| :checked | input:checked | 选择每个被选中的 <input> 元素。 |
| :not(selector) | :not(p) | 选择非 <p> 元素的每个元素。 |
七 、总结
- 如果元素有明确
id，name，class属性时，使用对应的基本定位方法。 - 如果没有
id，name，class属性时，或id，name，class属性是动态/不唯一的时候，使用XPath和css_selector定位。 - 定位页面超链接使用
link_text和partial_link_text定位 - 可使用
XPath和css_selector定位的时候，优先使用css_selector。
css_selector定位的速度和效率比Xpath高。 - 没有最好的，只有最精简的，怎么简单怎么来。
扩展：为什么css_selector定位的速度和效率比Xpath高?
因为你无论用那种方式定位，最终都会转换到css_selector进行元素定位。
我们可以在PyCharm中，安装ctrl点击对应的方法，进行查看源码，最终都会定位到如下代码：
def find_element(self, by=By.ID, value=None):"""Find an element given a By strategy and locator. Prefer the find_element_by_* methods whenpossible.:Usage:element = driver.find_element(By.ID, 'foo'):rtype: WebElement"""if self.w3c:if by == By.ID:by = By.CSS_SELECTORvalue = '[id="%s"]' % valueelif by == By.TAG_NAME:by = By.CSS_SELECTORelif by == By.CLASS_NAME:by = By.CSS_SELECTORvalue = ".%s" % valueelif by == By.NAME:by = By.CSS_SELECTORvalue = '[name="%s"]' % valuereturn self.execute(Command.FIND_ELEMENT, {'using': by,'value': value})['value']最好我这里给你们分享一下我所积累和真理的文档和学习资料有需要是领取就可以了
1、学习思路和方法
这个大纲涵盖了目前市面上企业百分之99的技术，这个大纲很详细的写了你该学习什么内容，企业会用到什么内容。总共十个专题足够你学习
2、想学习却无从下手，该如何学习？
这里我准备了对应上面的每个知识点的学习资料、可以自学神器，已经项目练手。
3、软件测试/自动化测试【全家桶装】学习中的工具、安装包、插件....
4、有了安装包和学习资料，没有项目实战怎么办，我这里都已经准备好了往下看
最后送上一句话：
世界的模样取决于你凝视它的目光，自己的价值取决于你的追求和心态，一切美好的愿望，不在等待中拥有，而是在奋斗中争取。
如果我的博客对你有帮助、如果你喜欢我的文章内容，请 “点赞” “评论” “收藏” 一键三连哦
Selenium基础 — CSS选择器定位大全相关推荐
- 11. 前端基础--CSS盒子定位
文章目录 前端基础--CSS盒子定位 1. 再看CSS 布局的三种机制 2. 为什么使用定位? 3. 定位详解 3.1 边偏移 3.2 定位模式 (position) 静态定位(static) -了解 ...
- selenium之CSS选择器
为什么我要学习CSS? 最近在学习Selenium+java,在元素定位的过程中需要使用到css选择器,所以巩固一下CSS的概述以及CSS选择器即可,个人是觉得没有必要对CSS的所有知识进行深入学习的 ...
- 2 - 前端基础--CSS 选择器
引入css方式(重点掌握) 1.行内样式 <div> <p style="color: green">我是一个段落</p></div> ...
- selenium之CSS Selector定位
什么是CSS Selector? CSS (Cascading Style Sheets) 是一种用于渲染 HTML 或者 XML 文档的语言,CSS 利用其选择器可以将样式属性绑定到文档中的指定元素 ...
- 10-CSS基础-CSS选择器
CSS选择器 标签选择器 什么是标签选择器? 作用: 根据指定的标签名称, 在当前界面中找到所有该名称的标签, 然后设置属性 格式: 标签名称{属性:值; } 注意点: 标签选择器选中的是当前界面中所 ...
- 利用武稀松版HtmlParser解析Html,使用CSS选择器定位节点
{Html解析器.最近因为用到Html解析功能.在网上找了几款Delphi版本的,结果发现解析复杂的HTML都有一些问题.没办法自己写了一款,经测试到现在没遇到任何解析不了的Html.wr960204 ...
- Web开发（一）·期末不挂之第四章·CSS语法基础(CSS选择器选择器优先级各类样式表的使用方法)
CSS语法基础 一.单纯html控制样式的缺点 二. CSS✪✪✪ CSS概述 CSS基础语法 组成 选择器 标签选择器 类选择器 id选择器 通配选择器 后代选择器 插入样式表的三种方式 行内样式 ...
- selenium之css元素定位方法
一. 单一属性定位(id用"#",class用".") 1:type selector driver.find_element_by_css_selector( ...
- 前端基础——CSS 选择器、网页美化
什么是CSS Cascading Style Sheet 层叠级联样式表 CSS:表现和美化网页 字体,颜色,边距,高度,宽度, 背景图片,网页定位,网页浮动 发展史: CSS1.0 CSS2.0: ...
最新文章
- Sketch 57.1 Mac中文版
- boost::asio::ip::tcp用法的测试程序
- 微信公众帐号开发教程第17篇-应用实例之智能翻译
- Python面向对象几个知识点
- WindStyle ExifInfo for Windows Live Writer发布
- PCL_PCLVisualizer在多线程中的使用问题(viewer spinOnce crash)
- 长等线,中等线,正等线,细等线,扁宋,扁等线
- 一根竹子，4天的生长过程
- html怎么做qq空间主页,如何设计qq空间
- Longest Word
- VMware虚拟机无法识别U盘
- C/C++编译器错误代码大全
- Cannot access 'age' before initialization错误
- zabbix4.4.3使用postgresql数据库
- 量子计算机拓扑超导新状态,美研制出奇特的拓扑超导体材料
- java aop 环绕通知_SpringAOP 环绕通知避坑
- RegularExpression正则表达式
- 用友U8案例教程应付管理前台操作
- C语言程序设计：输入一个三角形的三条边长，求出三角形的面积。
- 产品需求分析与用户体验设计