如何在 Puppeteer 中处理框架?
rest assureddynamic programmingprogramming更新于 2025/4/5 8:22:17
我们可以在 Puppeteer 中处理框架。html 代码中的框架由 frames/iframe 标记表示。Puppeteer 可以通过从主页切换到框架来处理框架。要处理框架内的元素，首先，我们必须借助定位器识别框架。 contentFrame 方法用于访问框架内的元素。
语法
const f = await page.$("frame[name='frame-bottom']")
const m = await f.contentFrame()
让我们查看框架内元素的 html 代码，并获取其中的文本 - BOTTOM。
上图中突出显示的标签名为 frame，其 name 属性的值为 frame-bottom。
示例
代码实现
//Puppeteer 库
const pt= require('puppeteer')
async function frameHandle(){
//以无头模式启动浏览器
const browser = await pt.launch()
//浏览器新页面
const page = await browser.newPage()
//启动 URL
await page.goto('https://the-internet.herokuapp.com/nested_frames')
//识别框架
const f = await page.$("frame[name='frame-bottom']")
//移动到框架
const x = await f.contentFrame();
//识别框架内的元素
const n = await x.$("body")
//获取文本
const v = await (await n.getProperty("textContent")).jsonValue()
console.log(v)
}
frameHandle()
输出
