破障篇-Day18|跨镜寻物咒:iframe 框架切换,抓取框架内部元素

1 次阅读 2026-10-20 16:33

📖 知识点

1. 什么是 iframe?

<iframe> 是一个嵌套框架,页面里内嵌一个独立的小网页(常见于:登录弹窗、广告、第三方组件、地图)。iframe 里的元素属于 "另一张页面",外层直接 page.ele() 找不到。

2. DrissionPage 自动进入 iframe

DrissionPage 的一大优势:不需要手动 "切换进去",用 iframe 的 locator 可以直接定位其中的元素:

# 定位iframe里的元素,用 iframe 选择器进入
ele = page.ele("iframe 元素选择器")

写法:选择器前加上 iframe 表示 "进入这个 iframe 里找元素",DrissionPage 会自动切换上下文。

3. 用 ele () 一步到位

# 先定位iframe框架,再找里面的元素
iframe = page.ele("iframe")               # 定位iframe框架本身
inner = iframe.ele(".inner-element")      # 进入iframe找内部元素
print(inner.text)

iframe.ele() 表示在这个 iframe 内部继续找元素,不用手动切换进出。

完整示例

from DrissionPage import ChromiumPage

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

# 跨镜寻物咒:找到iframe,钻进内部
frame = page.ele("iframe")
# 在iframe内定位元素
inner_btn = frame.ele(".submit-btn")
inner_btn.click()
print("✅ 已操作iframe内部的按钮")

💡 理解

  • iframe 内的元素,外层页面 "看不见",需要先定位 iframe,再在 iframe 里继续找
  • DrissionPage 通过 iframe.ele() 这种 "进入式" 写法,省去手动切换上下文

⚠️ 易错提醒

  1. 如果元素死活找不到,先检查它是不是在 iframe 里
  2. 有多层 iframe 嵌套时,需要逐层进入
  3. 定位 iframe 本身可以用 page.ele("iframe")(标签名)

⚔️ Kata 实战任务

任务需求:

  1. 导入 ChromiumPage
  2. 访问一个含 iframe 的练习页(如 https://the-internet.herokuapp.com/iframe)
  3. 用 page.ele("iframe") 定位 iframe 框架
  4. 在 iframe 内部定位文字输入区(如编辑器),读取或输入内容
  5. 打印 iframe 内部元素信息

参考代码

from DrissionPage import ChromiumPage

page = ChromiumPage()
# 访问含iframe的练习页
page.get("https://the-internet.herokuapp.com/iframe")
print("🌐 已打开iframe练习页")

# 跨镜寻物咒:定位iframe框架
frame = page.ele("iframe")
print("🎯 已定位到iframe框架:", frame.tag)

# 在iframe内部定位输入区
inner_body = frame.ele("body")
print("📝 iframe内部的body文字:", inner_body.text)

运行输出(示意):

🌐 已打开iframe练习页
🎯 已定位到iframe框架: iframe
📝 iframe内部的body文字: Your content goes here.

🧠 思考题

  1. 为什么外层 page.ele() 找不到 iframe 里面的元素?它们算不算 "同一张页面"?
  2. 如果网页里有多个 iframe,该怎么区分并进入指定的那个?