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"。文章地址https://www.yii666.com/blog/409796.html
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']