元素操纵篇-Day14｜下拉选定咒：下拉选择框 select 魔法

📖 知识点

1. 什么是下拉选择框？

网页里那种 "点击出列表、选一项" 的控件（<select>标签）就是下拉选择框，常见于选地区、选分类、选性别等场景。

2. 基础用法：先定位，再点击展开

下拉框操作分两步 —— 点击展开，再点选项：

# 1. 定位下拉框
select_box = page.ele(".my-select")
# 2. 点击展开下拉列表
select_box.click()
# 3. 点击想选的选项（用选项文字定位）
page.ele("text=北京").click()

3. 用选项文字精准选择

DrissionPage 支持用 "文字" 直接选中下拉选项，更稳更直观：

# 用文字匹配选项并点击选中
page.ele("select:option=北京").click()   # 按下拉框中"北京"选项

这种写法用选项的可见文字定位，比找嵌套元素更省心。

完整示例

from DrissionPage import ChromiumPage

page = ChromiumPage()
page.get("目标网址")

# 下拉选定咒
# 1. 点击下拉框展开
select_box = page.ele(".city-select")
select_box.click()
# 2. 用选项文字点击选中
page.ele("text=上海").click()
print("✅ 已选择：上海")

💡 补充：select:option=文字 写法

• 直接在定位选择器里用 select:option= 前缀 + 选项文字，能直接定位下拉框里指定文字的那个选项
• 适合选项是纯文字的简单下拉框

⚠️ 易错提醒

1. 很多下拉框是点击后动态渲染选项，点击展开后可能要稍等（可配合 wait）
2. 选项文字要匹配准确，大小写、空格要留意
3. 有的下拉框是 select 标签，有的是 div 模拟的，写法略有不同

⚔️ Kata 实战任务

任务需求：

1. 导入 ChromiumPage
2. （演示练习）访问一个带下拉框的示例页面
3. 定位下拉框元素，点击展开
4. 用选项文字定位并点击选中一项
5. 打印选择完成提示

💡 提示：由于不同网站下拉框结构不一，本课以通用套路为核心：定位下拉框 → 点击展开 → 按选项文字点击。你在自己熟悉的网站（如注册页、搜索筛选页）上套用即可。

参考代码

from DrissionPage import ChromiumPage

page = ChromiumPage()
page.get("目标网址")  # 替换为你想要练习的带下拉框的网址

# 1. 定位下拉框
select_box = page.ele(".my-select")   # 替换为实际选择器
# 2. 点击展开下拉
select_box.click()
print("✅ 下拉框已展开")

# 3. 用选项文字点击选中
page.ele("text=北京").click()         # 替换为实际选项文字
print("✅ 已选中选项：北京")

运行输出：

✅ 下拉框已展开
✅ 已选中选项：北京

🧠 思考题

1. 下拉框操作通常分哪几步？为什么点击展开后可能要等待？
2. 用 "选项文字" 定位和用 CSS 选择器定位选项，各有什么优劣？