ReferenceError：虽然我使用的是 puppeteer，但未定义文档答案

【问题标题】：ReferenceError: document is not defined although I am using puppeteerReferenceError：虽然我使用的是 puppeteer，但未定义文档
【发布时间】：2020-12-26 00:58:40
【问题描述】：

如您所见，我添加了 puppeteer，但总是收到错误消息。我正在尝试使用 getElementById 函数来操作我的 html 前端。

const puppeteer = require('puppeteer');

(async function getPrice(){

let URL= 'https://www.coingecko.com/en/coins/synthetix-network-token';
let browser = await puppeteer.launch();
let page = await browser.newPage();
await page.goto(URL, {waitUntil: 'networkidle2'});

let data = await page.evaluate(() => {

    try {
    let price=document.querySelector('div[class="text-3xl"] > span').innerText;

        return {
           price
        }
    
    }catch(err) {
    reject(err.toString());
    }})


console.log(Object.values(data));
document.getElementById("snxprice").innerHTML = Object.values(data);
await browser.close();


}().catch(function(error) {
    console.error('Document is not defined!');
    process.exit();
});

【问题讨论】：

尝试更好地解释问题，添加puppeteer的链接是件好事，不是所有人都知道是什么...接下来，描述你是使用babel编译还是在nodejs中，在几句话，定义上下文，这可以帮助回答你的问题。请避免发布“解决此问题...”之类的帖子并发布代码。最后一件事是尝试更好地格式化您的代码。希望对您有所帮助。

标签： javascript puppeteer

【解决方案1】：

此行：document.getElementById("snxprice").innerHTML = Object.values(data); 在 puppeteer 中无效。

每次需要 DOM 文档（需要评估页面上下文）时，都必须使用 page.evaluate，如下所示：

await page.evaluate(data => {
    const element = document.querySelector('#snxprice')
    element.innerHTML = Object.values(data)
 }, data)

注意： #snxprice 很可能在 iframe 中，因为 puppeteer 无法在页面中找到它。所以你最终需要的是frame.evaluate。

【讨论】：

感谢大卫的回答。我不再遇到错误了。我还添加到您写的行：document.addEventListener("DOMContentLoaded", function(event) {。但是，我无法更新 html 文件中的值，querySelector 和 getElementById 无法正常工作，您知道吗？为什么？
如果你的元素有value属性，你可以这样设置：await page.evaluate(data => { document.querySelector('#snxprice').value = Object.values(data) }, data)github.com/puppeteer/puppeteer/issues/441 stackoverflow.com/questions/47966510/…
不，元素没有 value 属性。我的 javascript 工作正常，但是我遇到的困难是将该值发送到 html 上的特定 id。