我试图使用带有getElementById的外部Javascript修改HTML元素的内容,但它不起作用

我试图使用带有getElementById的外部Javascript修改HTML元素的内容,但它不起作用,javascript,getelementbyid,Javascript,Getelementbyid,我的javascript文件是从网站上抓取数据并返回正确答案的网页。但是,HTML文件似乎没有更新信息。有人能告诉我哪里出了问题吗?在我的HTML文件中,我确保位于正文段落的末尾 const puppeteer = require('puppeteer'); (async function getPrice(){ let URL= 'https://www.coingecko.com/en/coins/synthetix-network-token'; let browser

我的javascript文件是从网站上抓取数据并返回正确答案的网页。但是,HTML文件似乎没有更新信息。有人能告诉我哪里出了问题吗?在我的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: 'load'});

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

        try {
        let price=document.querySelector('div[class="text-3xl"] > span').innerText;
            return {
               price
            }
    
        }catch(err) {
        reject(err.toString());
        }})
    
        variable=Object.values(data)[0];
        console.log(variable);
    
    
        await page.evaluate(data => {
        
            window.addEventListener("DOMContentLoaded", function() { 
    
            const element = document.getElementById("snxprice");
            element.innerHTML = Object.values(data)[0];
        
            });
        
         }, data)

     
     
    await browser.close();

})().catch(function(error) {
        console.error(error);
        process.exit();
});

console.log(element)
添加到代码的元素之后,查看控制台中返回的内容。它不会打印任何内容。据我所知,page.evaluate函数中运行的所有内容都是在浏览器页面的上下文中完成的,而不是在node.js中。