使用 cheerio 抓取 html 无法检索第二个连续元素

Question

伙计们，我正在使用 cheerio 抓取如下所示的 html 文档，我需要找出每个文章元素中两个元素的 href。

<article>
  <div class="row">
       <div class="col-md-5 col-6">
          <a  class="btn" href="https://xxxxxx.png">abc1</a>
       </div>
       <div class="col-md-5 col-6">
          <a class="btn"  href="https://xxxxx">abc2</a>
       </div>
  </div>
</article>

<article>
   ....
</article>

....

下面是我的脚本，它使用.btn 查找每个元素并使用nth-child 按顺序获取它们，它可以成功获取第一个元素的href，但是它无法获取第二个元素的值。知道如何解决问题吗？

const $ = cheerio.load(html);
$("article").each((i, element) => {
    let element1 = $(element).find(".btn:nth-child(1)").attr("href");
    let element2 = $(element).find(".btn:nth-child(2)").attr("href");

    console.log(element1,element2);
 });

Answer 1

nth-child(num) 选择器查找作为其直接父元素的第 num 个子元素的元素。这就是为什么 .btn:nth-child(2) returns 没有元素，因为第二个 a 标签也是其直接父标签的第一个子标签（div 和 class col-md-5和 col-6).

您可以通过以下方式访问两个 a 标签：

const $ = cheerio.load(html);
$("article").each((i, element) => {
    let allBtns = $(element).find(".btn");
    let element1 = $(allBtns.get(0)).attr("href");
    let element2 = $(allBtns.get(1)).attr("href");

    console.log(element1,element2);
 });

在这种情况下，我们获取所有具有 btn class 的元素，然后在该列表中查找第一个和第二个元素（从零开始的索引）。

使用 cheerio 抓取 html 无法检索第二个连续元素

using cheerio to scrape the html can't retrieve the second consecutive element

html

node.js

scrape

cheerio