12. 元素定位语法概述

定位元素是网页自动化最重要的技能。

DrissionPage 提供了一套自己的简洁语法，同时兼容 xpath 和 css selector。

为什么不推荐右键复制路径

很多新手习惯在开发者工具里右键复制 selector 或 xpath。

这样做有几个问题：

• 代码冗长，可读性低
• 动态页面容易导致元素失效
• 网页稍作改动就失效，容错性低
• 不能跨 <iframe> 查找元素

所以作者极不建议使用右键复制的路径。

三种属性

DrissionPage 的定位语法基于三种元素属性：

写法	说明	示例
@tag()	标签名	<div> 中的 div
@****	标签属性	id="one" 写作 @id
@text()	元素文本	<p>第三行</p> 中的 第三行

@tag() 和 @text() 后面的 () 是为了和普通属性区分。

比如 <div text="abc">，如果不加括号会和文本属性混淆。

四种匹配模式

符号	模式	示例	含义
=	精确匹配	@id=one	id 等于 one
:	模糊匹配	@id:ow	id 包含 ow
^	匹配开头	@id^row	id 以 row 开头
$	匹配结尾	@id$w1	id 以 w1 结尾

注意：tag() 属性只有 = 模式。

三种关系

单属性匹配 @

只有一个条件时，用单个 @：

tab.ele('@id=one')        # id 为 one 的元素
tab.ele('@tag()=div')     # 第一个 div 元素
tab.ele('@text()=第一行') # 文本为"第一行"的元素

多属性与关系 @@

多个条件同时满足，每个条件用 @@ 开头：

# class 为 p_cls 且文本为"第三行"
tab.ele('@@class=p_cls@@text()=第三行')

多属性或关系 @|

满足任意一个条件，每个条件用 @| 开头：

# id 为 row1 或 id 为 row2
tab.eles('@|id=row1@|id=row2')

否定匹配 @!

排除某个条件：

# id 不等于 one
tab.ele('@!id=one')

# 没有 class 属性的元素
tab.ele('@!class')

常用快捷语法

为了简洁，DrissionPage 提供了一些快捷写法：

快捷语法	等价写法	说明
#one	@id=one	匹配 id
.p_cls	@class=p_cls	匹配 class
text=第二行	@text()=第二行	匹配文本
tag:div	@tag()=div	匹配标签

这些快捷语法只能在语句最前面且单独使用时生效。

tab.ele('#one')           # id 为 one
tab.ele('.p_cls')         # class 为 p_cls
tab.ele('第二行')          # 文本包含"第二行"（默认模糊匹配）
tab.ele('tag:div')        # 第一个 div
tab.ele('text=第二行')    # 文本精确匹配

兼容 xpath 和 css

DrissionPage 完全兼容 xpath 和 css selector：

# css selector
tab.ele('css:.p_cls')
tab.ele('#kw')

# xpath
tab.ele('xpath://div[@id="one"]')

也支持 selenium 原生的 loc 元组：

from DrissionPage.common import By

loc = (By.ID, 'one')
tab.ele(loc)

获取多个元素

ele() 返回第一个匹配的元素。eles() 返回所有匹配的：

# 获取第一个 div
div = tab.ele('tag:div')

# 获取所有 div
divs = tab.eles('tag:div')

# 获取所有 class 为 p_cls 的元素
items = tab.eles('.p_cls')

链式查找

先找到父元素，再在范围内查找子元素：

div1 = tab.ele('#one')
p_list = div1.eles('tag:p')

这种方式效率更高，代码更清晰。