使用cheerio在html内获取元素名称

Question

是前端新手。我无法使用cheerio在html内获取元素。请在下面查看我正在尝试的内容。我看了其他帖子，它们有助于了解cheerio的工作原理，但不是这样。

我的目标是获得价值。我想从<td class="ctr2">67%</td>中获得67％的价值。我变得不确定。该标签td class="ctr2"出现了多次，但我只想从头开始。

我一段时间以来一直在尝试安静。我用cheerio得到undefined。我想念的是什么？

<tfoot>
                <tr>
                    <td>Total</td>
                    <td class="bar">966 of 2,945</td>
                    <td class="ctr2">67%</td>
                    <td class="bar">56 of 168</td>
                    <td class="ctr2">66%</td>
                    <td class="ctr1">72</td>
                    <td class="ctr2">224</td>
                    <td class="ctr1">167</td>
                    <td class="ctr2">580</td>
                    <td class="ctr1">31</td>
                    <td class="ctr2">140</td>
                    <td class="ctr1">0</td>
                    <td class="ctr2">17</td>
                </tr>
            </tfoot>

我正在下面尝试在node.js中使用cheerio

const cheerio = require('cheerio');
var fs = require('fs');

const demo= cheerio.load(fs.readFileSync('sample123.html'))
console.log(demo('#ctr2'));

Answer 1

我发现您的代码有几个问题：

1. #ctr2是具有id="cntr2"的元素的选择器。您的HTML中没有任何id值。相反，如果要选择具有该类名称的项目，则需要使用".ctr2"。
2. 您的HTML是不完整的，因为周围没有<table>和</table>。

如果您修复了这两件事并运行此代码：

const cheerio = require('cheerio');
var fs = require('fs');

const $ = cheerio.load(fs.readFileSync('sample123.html'))
$('.ctr2').each((index, element) => {
    console.log($(element).text());    
});

然后，它将生成此输出：

67%
66%
224
580
140
17

---

如果只需要第一个.cntr2项目，则可以在选择器结果上使用.first()，如下所示：

const cheerio = require('cheerio');
var fs = require('fs');

const $ = cheerio.load(fs.readFileSync('sample123.html'))
console.log($('.ctr2').first().text());

哪个将生成此输出：

67%