Question

我是新的木偶操作者，但对javascript和Node.js相当满意，但遇到了一个问题，我发现了一个相当简单的Node进程来捕获屏幕截图。是否可以在获取屏幕截图之前使用puppeteer更改HTML元素的innerText？

我已经成功使用puppeteer在身份验证字段中键入文本并登录到站点，但是想知道是否有类似的方法可以让我更改特定元素中的文本（使用id或类名）< / p>

我正在使用的截屏代码示例：

const puppeteer = require('puppeteer');
 (async () => {
    const browser = await puppeteer.launch()
    const page = await browser.newPage()
    await page.goto('https://google.com')
    await page.screenshot({path: 'google.png'})
    await browser.close()
 })()

所以在这个例子中，我有兴趣知道我是否可以更改元素的文本内容，例如ID为'lga'的div ...例如添加文本字符串。

木偶戏有可能吗？

否则，它工作得很好，我只需要在页面中插入一些文字我正在执行截图。我只在ubuntu 16.04机器上使用命令行，而节点版本9，puppeteer版本1.0.0

Answer 1

你可以在屏幕之前做到这一点

 await page.evaluate(() => {
    let dom = document.querySelector('#id');
    dom.innerHTML = "change to something"
 });

Answer 2

page。$ eval（）

在截屏之前，您可以使用page.$eval()更改元素的innerText：

await page.$eval('#example', element => element.innerText = 'Hello, world!');

await page.screenshot({
  path: 'google.png',
});

在创建屏幕截图之前，是否可以使用puppeteer修改DOM中的元素？

2 个答案:

page。$ eval（）