Puppeteer 获取所有选项的值

Question

我想获取所有选项值的数组，但我总是只获取第一个选项。

HTML来源：

<div class="select-wrapper control-container">
    <select name="type" id="product_finder_type" class="widget-input" data-name="type">
        <option class="placeholder">Select Vehicle Type</option>
        <option value="pc" >Passenger Car</option>
        <option value="truck" >Truck</option>
        <option value="conag" >Construction and Agriculture</option>
        <option value="bike" >Bike</option>
    </select>
</div>

我的代码：

const tipusArray = await page.evaluate(() =>
    Array.from(
      document.querySelectorAll('#product_finder_type'),
      (element) =>
        element.textContent
    )
  );

console.log(tipusArray)

结果：

[ '\n\t\t\t\t\t\t\t\tSelect Vehicle Type\t\t\t\t\t\t\t' ]

如何收集所有选项？

Answer 1

主要问题出在您的选择器上：

const tipusArray = await page.evaluate(() =>
    Array.from(document.querySelectorAll('#product_finder_type option')).map(element=>element.value)
  );

console.log(tipusArray)

以上代码将为您提供所有选项值的数组

前提是所有数据都是静态的。换句话说，如果网站正在使用 js 加载一些数据，那么您将不得不等到网站完成所有 api 调用，然后运行查询。

您可以使用以下方法完成上述操作：

await page.waitForTimeout(4000)

Puppeteer 获取所有选项的值

Puppeteer get all option's value

javascript

option

puppeteer