ReferenceError：雖然我使用的是 puppeteer，但文檔未定義

Question

如您所見，我添加了 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();
});

Answer 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 內，因為#snxprice無法在頁面中找到它。 所以你最終需要的是frame.evaluate 。