Cheerio .text()返回错误的响应。

Question

我在node.js中使用cheerio来获取一个网站的元素。有了这个，我要做星星和其他东西。

我想只取下面代码中的文本。

<div id="graphDD3" class="pie-chart small" style="padding: 0px; position: relative;">
   42.2%    
<canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 100px; height: 100px;" width="100" height="100"></canvas>
<canvas class="flot-overlay" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 100px; height: 100px;" width="100" height="100"></canvas>
</div>

我试过以下代码

let rate = $('#graphDD3').text().trim();
console.log(rate);

但我的控制台说 0 而不是 42.2%

谁能帮帮我？或者你知道另一种解决方案来解决这个问题吗？

感谢那些愿意花时间帮助我的人。

Answer 1

更新2

以下是Puppeteer代码等待的内容 3000ms 前提取文本。您可以手动更新这个延迟，或者您可以设置一个函数来监控HTML的变化，如本章所述的 回答.

const puppeteer = require('puppeteer');

(async () => {

    const browser = await puppeteer.launch({ headless: true });
    const page = await browser.newPage();
    await page.goto('http://localhost:8000',{ waitUntil: 'domcontentloaded' });

    await page.waitFor(3000);
    console.log(await page.$eval('#graphDD3', el => el.innerText));

    await browser.close();
})();

作为一个侧面说明可以使用下面的代码段来时间的文本变化，然后使用该值提供适当的延迟到 .waitFor() 方法。但不要不考虑所有后果，就原封不动地使用这个无限循环。

var startTime  = new Date()
  while(true){
    const val = await page.$eval('#graphDD3', el => el.innerText);
    if(val != '0'){
      console.log(val);
      break;
    } 
  }
 console.log(new Date - startTime);

---

更新1

您的代码中没有语法错误，所以问题很可能是由于JavaScript渲染内容造成的。在这种情况下，为了得到正确的结果，你必须使用无头浏览器来渲染页面，如 puppeteer 然后你就可以提取信息了。

---

原答案

.text() 是一个方法而不是一个属性。 所以代码应该改为

let rate = $('#graphDD3');
console.log(rate.text().trim())