酒店网站的 Puppeteer/CSS 选择器 - 价格从结果页面返回两倍

Question

在这个酒店网站 (https://www.marriott.com/default.mi) 中，我试图从结果页面中提取酒店名称、价格和距离。

问题：

prices

返回两次并从这行代码中弄乱我的结果数组：

page.$$eval('[id^="property-record-map-"] .t-price', elements => elements.map(el => el.textContent.trim()))

代码块：

  // Get textContent from results page for: hotel names, prices, distances. Destructuring assignment to assign results of 3 asynchronous fx to 3 separate arrs: `hotelNames`, `prices`, `distances`
  const [hotelNames, prices, distances] = await Promise.all([
    page.$$eval('[id^="property-record-map"] span.l-property-name', elements => elements.map(el => el.textContent.trim())),
    // ! returns price twice
    page.$$eval('[id^="property-record-map-"] .t-price', elements => elements.map(el => el.textContent.trim())),
    page.$$eval('.js-hotel-distance.l-hotel-distance', elements => elements.map(el => el.textContent.trim()))
  ]);

截图：

fs.writeFile .txt 输出文件示例：

Courtyard Los Angeles L.A. LIVE, 
The Ritz-Carlton [...]
555,
555,
736,
736, [...]

更详细的结果解释：

正如您从.txt 和屏幕截图中看到的那样，它采用了第一家酒店（万怡酒店）的价格并复制了它（555 显示了两次）。然后它采用第二家酒店（丽思卡尔顿酒店）的价格并复制它（736 显示两次）。

---

重现我所做的：

前往 (https://www.marriott.com/default.mi)，输入任何目的地、住宿日期，但在您点击

Find Hotels

后，确保点击复选框

Show rates with taxes and all fees

和

Show available hotels only

，如下所示更改 CSS 选择器。

---

我尝试过的事情：

i) 没有修剪 - 没有区别

page.$$eval('[id^="property-record-map-"] .t-price', elements => elements.map(el => el.textContent))

ii) t-price m-display-block - 返回错误的价格

page.$$eval('[id^="property-record-map-"] [class="t-price  m-display-block "]', elements => elements.map(el => el.textContent))