查找元素（二）

一、在结果列表中筛选

eles()、nexts()等能够获取多个元素的方法，返回的列表可进行进一步筛选，以获取指定的元素。

示例1，筛选并返回元素列表：

from DrissionPage import ChromiumPage

page = ChromiumPage()
page.get('https://www.baidu.com')
eles = page('#s-top-left').eles('t:a')  # 获取左上角导航栏内所有<a>元素
for ele in eles.filter.displayed():  # 筛选出显示的元素列表并逐个打印文本
    print(ele.text, end=' ')

输出：

新闻 hao123 地图 贴吧 视频 图片 网盘 文库 更多

示例2，筛选并返回第一个元素：

from DrissionPage import ChromiumPage

page = ChromiumPage()
page.get('https://www.baidu.com')
eles = page('#s-top-left').eles('t:a')  # 获取左上角导航栏内所有<a>元素
print(eles.filter_one.displayed().text)  # 筛选出显示的元素并返回第一个

输出：

新闻

1.1.获取单个匹配元素

⑴.filter_one.displayed()

用于在元素列表中以是否显示为条件筛选元素(显示到页面的第一条结果)，返回第一个结果。

参数：

参数名称	类型	默认值	说明
`equal`	`bool`	`True`	是否匹配显示的元素，`False`匹配不显示的

返回值：

返回类型	说明
`ChromiumElement`	匹配成功返回元素对象
`NoneElement`	失败返回`NoneElement`
抛出`ElementNotFoundError`异常	`Settings.raise_when_ele_not_found`为`True`时抛出

示例如下：

element = elements.filter_one.displayed()

⑵.filter_one.checked(equal=True)

作用: 以元素是否被选中为条件筛选。

参数:

equal (bool): True 表示匹配被选中的元素，False 表示匹配不被选中的元素。

返回: 匹配成功返回 ChromiumElement，失败返回 NoneElement。

异常: 当 Settings.raise_when_ele_not_found 为 True 时抛出 ElementNotFoundError。

# 获取第一个被选中的元素:
element = elements.filter_one.checked()

⑶.filter_one.selected(equal=True)

作用: 以 <select> 元素项目的选择状态为条件筛选。

参数:

equal (bool): True 表示匹配被选择的元素，False 表示匹配不被选择的元素。

返回: 匹配成功返回 ChromiumElement，失败返回 NoneElement。

异常: 当 Settings.raise_when_ele_not_found 为 True 时抛出 ElementNotFoundError。

# 获取第一个选择的 <select> 元素项:
element = elements.filter_one.selected()

⑷.filter_one.enabled(equal=True)

作用: 以元素是否可用为条件筛选。
参数:

equal (bool): True 表示匹配可用的元素，False 表示匹配不可用的元素。

返回: 匹配成功返回 ChromiumElement，失败返回 NoneElement。

异常: 当 Settings.raise_when_ele_not_found 为 True 时抛出 ElementNotFoundError。

# 获取第一个可用的元素:
element = elements.filter_one.enabled()

⑸.filter_one.clickable(equal=True)

作用: 以元素是否可点击为条件筛选。
参数:

equal (bool): True 表示匹配可点击的元素，False 表示匹配不可点击的元素。

返回: 匹配成功返回 ChromiumElement，失败返回 NoneElement。
异常: 当 Settings.raise_when_ele_not_found 为 True 时抛出 ElementNotFoundError。

# 获取第一个可点击的元素:
element = elements.filter_one.clickable()

⑹.filter_one.have_rect(equal=True)

作用: 以元素是否有大小为条件筛选。
参数:

equal (bool): True 表示匹配有大小的元素，False 表示匹配没有大小的元素。

返回: 匹配成功返回 ChromiumElement，失败返回 NoneElement。
异常: 当 Settings.raise_when_ele_not_found 为 True 时抛出 ElementNotFoundError。

# 获取第一个有大小的元素:
element = elements.filter_one.have_rect()

⑺.filter_one.style(name, value, equal=True)

作用: 以元素的 style 属性值为条件筛选。
参数:

name (str): style 属性名称。
value (str): 属性值。
equal (bool): True 表示匹配指定的 style 值，False 表示匹配不指定的值。

返回: 匹配成功返回 ChromiumElement，失败返回 NoneElement。
异常: 当 Settings.raise_when_ele_not_found 为 True 时抛出 ElementNotFoundError。

# 获取第一个具有特定 style 属性值的元素:
element = elements.filter_one.style(name='color', value='red')

⑻.filter_one.property(name, value, equal=True)

作用: 以元素的 property 属性值为条件筛选。

参数:

name (str): property 属性名称。
value (str): 属性值。
equal (bool): True 表示匹配指定的 property 值，False 表示匹配不指定的值。

返回: 匹配成功返回 ChromiumElement，失败返回 NoneElement。
异常: 当 Settings.raise_when_ele_not_found 为 True 时抛出 ElementNotFoundError。

# 获取第一个具有特定 property 值的元素:
element = elements.filter_one.property(name='disabled', value='true')

在浏览器自动化或网页测试中，property 通常指的是 HTML 元素的属性，但它与元素的 attribute 有一些区别。具体而言：property vs attribute

attribute: 这是 HTML 元素的标准属性，如 id、class、href、src 等。attribute 是 HTML 元素的定义部分，存储在 HTML 文档中，并且可以通过 JavaScript 直接访问或修改。例如，<input type="text" value="example"> 中的 value 就是一个 attribute。
property: 这是 JavaScript 对象模型中的属性，用于描述 HTML 元素在文档中的状态或行为。它们通常反映了元素的当前状态或动态值。例如，input 元素的 value 属性（属性名与 HTML 中的 attribute 相同）在 JavaScript 中称为 property，它可能会随着用户输入而改变。

假设你有一个 HTML 元素如下：

<input id="username" type="text" value="default" disabled>

在 JavaScript 中，这个元素有以下 attributes 和 properties:

Attributes:

id: "username"
type: "text"
value: "default"
disabled: "" (存在，表示禁用)

Properties:

id: "username"
type: "text"
value: "default" (当前值可能会随着用户输入改变)
disabled: true (表示元素当前是否被禁用)

使用 property 方法筛选元素

在使用 filter_one.property(name, value, equal=True) 方法时，你是通过 JavaScript 对象模型来筛选元素。举个例子：

element = elements.filter_one.property(name='disabled', value='true')

这个方法将筛选出 disabled 属性为 true 的元素，表示这些元素在当前状态下是禁用的。此时，property 指的是元素的动态状态而非静态 HTML 属性。

总结

attribute: 静态定义的 HTML 元素属性。
property: 动态描述 HTML 元素的 JavaScript 对象属性。

使用 filter_one.property 方法筛选元素时，你是在通过元素的动态状态或行为来进行筛选

⑼.filter_one.attr(name, value, equal=True)

作用: 以元素的 attribute 属性值为条件筛选。
参数:

name (str): 属性名称。
value (str): 属性值。
equal (bool): True 表示匹配指定的 attribute 值，False 表示匹配不指定的值。

返回: 匹配成功返回 ChromiumElement，失败返回 NoneElement。
异常: 当 Settings.raise_when_ele_not_found 为 True 时抛出 ElementNotFoundError。\

# 获取第一个具有特定 attribute 值的元素:
element = elements.filter_one.attr(name='data-id', value='123')

⑽.filter_one.text(text, fuzzy=True, contain=True)

作用: 以元素的文本内容为条件筛选。
参数:

text (str): 用于匹配的文本。
fuzzy (bool): True 表示模糊匹配，False 表示精确匹配。
contain (bool): True 表示匹配包含指定文本的元素，False 表示不包含。

返回: 匹配成功返回 ChromiumElement，失败返回 NoneElement。
异常: 当 Settings.raise_when_ele_not_found 为 True 时抛出 ElementNotFoundError。

# 获取第一个文本包含“图”的元素:
element = elements.filter_one.text(text='图')
# 获取第二个文本包含“图”的元素:
element = elements.filter_one(2).text('图')

1.2.获取全部匹配元素

静态元素列表只有filter.attr()和filter.text()方法。