Question

咨询：我是第一次尝试这样做。

我创建了一个显示总线时序的html页面。为了获得公交车时刻，我不得不与puppeteer一起刮擦当地的公交服务网站。我确实抓紧了下一辆公共汽车的时间，但似乎无法将其添加到我的html页面中。

我尝试添加带有指向我的js文件的src的脚本标签。我尝试将它们添加到div的头部，该div应该显示时间，并且紧接在body标记之前，但是我无法显示时间。我事件试图将脚本标签中的js添加到html中，但这没用。

//Here's code for scraping in busTimeScraper.js :
  let scrape = async() => {
  const browser = await puppeteer.launch({
    headless: true
  });
  const page = await browser.newPage();
  await page.goto('bustimes.com');    //Dummy website for this eg
  await page.setViewport({width: 1500, height: 1500})
  await page.waitFor(5000);

  const result = await page.evaluate(() => {
     let time = document.querySelector('#RouteTimetable').innerText;
     return {
        time
     }
 });

 browser.close();
 return result;

 };

 scrape().then((value) => {
    var timing = value.time;
    document.querySelector('#Time').innerText=timing;
 });

//The html is :
 <div id="Time">
  <!--<script type="text/javascript" src="busTimeScraper.js">
          </script>-->
 </div>

运行js文件并对计时变量执行console.log时，我看到的时间浪费了。我希望div会填充相同的时间值，但它始终保持空白

Answer 1

您根本无法使用脚本标签在客户端html中添加服务器端JS并期望它可以工作，无论您在何处添加（在头部，内部元素中还是在关闭主体之前）；

最简单的解决方案是通过NodeJsAPI公开结果（定时变量），并通过客户端JS通过API使用该API，以获取价值并完成其余的客户端工作。

如何使用puppetteer将抓取的数据添加到html

1 个答案: