使用 Puppeteer 在类中选择一个 div答案

【问题标题】：Selecting a div within a class with Puppeeter使用 Puppeteer 在类中选择一个 div
【发布时间】：2021-04-10 18:24:54
【问题描述】：

嗨，我正在尝试在类中选择给定的 div。 html是这样设置的：

<div class="items">
    <div>fist div</div>
    <div>second div</div>
    <div>third div</div>
</div>
<div class="items">
    <div>fist div two</div>
    <div>second div two</div>
    <div>third div two</div>
</div>
<div class="items">
    <div>fist div three</div>
    <div>second div three</div>
    <div>third div three</div>
</div>

我的脚本是这样的：

  let info = await page.evaluate(() => {
    let data = [];
    let elements = document.getElementsByClassName("items");
    let yr = elements[0].getElementsByTagName("div");
    for (var i of yr) {
      data.push(i.textContent);
    }
    return data;
  });

这样返回所有的 divs inn ann 数组

["fist div"],["second div"],["third div"]

我想要实现的是获得所有类的所有 div。所以它看起来像：

[
["fist div"],["second div"],["third div"],
["fist div two"],["second div two"],["third div two"],
["fist div three"],["second div three"],["third div three"],
]

我正在做一个 foo 循环，但我似乎无法让它工作。有什么想法吗？

【问题讨论】：

我会看到这个问题的第二个答案。 stackoverflow.com/a/60733311/15410

标签： javascript puppeteer

【解决方案1】：

嗯，你需要两个循环：

  let info = await page.evaluate(() => {
    let data = [];
    let elements = document.getElementsByClassName("items");
    for (var j in elements) {
      let yr = elements[j].getElementsByTagName("div");
      for (var i of yr) {
        data.push(i.textContent);
      }
    }
    return data;
  });

或者，更易读：

let info = await page.evaluate(() => {
  let data = [];
  document.getElementsByClassName("items").forEach(e =>
    e.getElementsByTagName("div").forEach(i => data.push(i.textContent))
  );
});

【讨论】：

我收到此错误：评估失败：TypeError: elements[j].getElementsByTagName is not a function

【解决方案2】：

只需添加 for 循环并获取长度 获取所有元素，当您使用elements[0] 时，您只会得到第一个<div class="items">

 let info = await page.evaluate(() => { let data = [];
    let elements = document.getElementsByClassName("items");
    for(let x=0;x<elements.length;x++){  
        let yr = elements[x].getElementsByTagName("div");
    for (var i of yr) {
      data.push(i.textContent);
    }
    }
      
    return data;
  });

【讨论】：