水晶启幕篇-Day6｜文字提取咒：读取元素文本、提取元素属性魔法

📖 知识点

1. 提取元素文字

元素里的可见文字，用 .text 读取：

ele = page.ele("元素选择器")
text = ele.text   # 提取元素里的文字
print(text)

.text 拿到的是元素里人眼可见的文字，纯净无 HTML 标签。

2. 提取元素属性

元素身上的各种属性（如链接地址、图片地址、class 名），用 .attr("属性名")：

# 提取链接的 href 属性（跳转地址）
href = ele.attr("href")
# 提取图片的 src 属性（图片地址）
img_src = ele.attr("src")

常用属性名：href（链接）、src（图片 / 资源地址）、class（类名）、id（ID）、name（名称）。

3. 一步定位 + 提取 连贯写法

# 一步到位：定位图片元素并取src属性
logo_src = page.ele("#s_lg_img").attr("src")
# 一步到位：定位链接元素并取文字
link_text = page.ele("a").text

完整示例

from DrissionPage import ChromiumPage

page = ChromiumPage()
page.get("https://www.baidu.com")

# 定位logo元素
logo = page.ele("#s_lg_img")
print("logo的文字：", logo.text)      # 图片通常无文字
print("logo的src属性：", logo.attr("src"))  # 图片地址

# 定位第一个链接，提取文字和地址
first_link = page.ele("a")
print("第一个链接的文字：", first_link.text)
print("第一个链接的地址：", first_link.attr("href"))

⚠️ 易错提醒

1. .text 不加括号；.attr("xxx") 要加括号并传入属性名
2. 如果元素没有该属性，.attr() 返回 None
3. 图片元素一般没有文字，.text 可能返回空

⚔️ Kata 实战任务

任务需求：

1. 导入 ChromiumPage，访问百度
2. 定位搜索按钮 #su，提取它的 value 属性（按钮文字）和 class
3. 定位第一个 <a> 链接，提取它的文字 text 和 href 属性
4. 打印全部提取结果

参考代码

from DrissionPage import ChromiumPage

page = ChromiumPage()
page.get("https://www.baidu.com")

# 定位搜索按钮，提取属性
search_btn = page.ele("#su")
print("🔘 搜索按钮的value属性：", search_btn.attr("value"))
print("🔘 搜索按钮的class属性：", search_btn.attr("class"))

# 定位第一个链接，提取文字和地址
first_link = page.ele("a")
print("🔗 第一个链接的文字：", first_link.text)
print("🔗 第一个链接的href：", first_link.attr("href"))

运行输出（内容以实际网页为准）：

🔘 搜索按钮的value属性： 百度一下
🔘 搜索按钮的class属性： btn self-btn bg s_btn
🔗 第一个链接的文字： 新闻
🔗 第一个链接的href： https://news.baidu.com

🧠 思考题

1. 提取图片链接该用 attr("href") 还是 attr("src")？为什么？
2. .text 和 .attr() 返回的都是字符串吗？如果元素没有某个属性会得到什么？