JavaScript 迭代对象列表

Question

我正在为 Skyscanner 写一个刮板只是为了好玩。 我要做的是遍历所有列表的列表，并为每个列表提取 URL。

到目前为止，我所做的是获取返回的列表 $("div[class^='FlightsResults_dayViewItems']")

但我不确定如何遍历返回的 object 并获取 URL (/transport/flight/bos...)。 我拥有的伪代码是

for(listings in $("div[class^='FlightsResults_dayViewItems']")) {
     go to class^='EcoTickerWrapper_itineraryContainer' 
          go to class^='FlightsTicket_container'
               go to class^='FlightsTicket_link' and get the href and save in an array
}

我将如何 go 这样做？ 旁注，我正在使用cheerio和jquery。

更新：我发现 CSS 选择器是

$("div[class^='FlightsResults_dayViewItems'] > div:nth-child(at_index_i) > div[class^='EcoTicketWrapper_itineraryContainer'] > div[class^='FlightsTicket_container'] > a[class^='FlightsTicket_link']").href

现在，我试图弄清楚如何遍历列表并为循环中的每个列表应用选择器。

此外，似乎不包括 div:nth-child(at_index_i) 将不起作用。 有没有解决的办法？

$("div[class^='FlightsResults_dayViewItems'] > div:nth-child(3) > div[class^='EcoTicketWrapper_itineraryContainer'] > div[class^='FlightsTicket_container'] > [class^='FlightsTicket_link']").attr("href")

"/transport/flights/bos/cun/210301/210331/config/10081-2103010815--32733-0-10803-2103011250|10803-2103311225--31722-1-10081-2103312125?adults=1&adultsv2=1&cabinclass=economy&children=0&childrenv2=&destinationentityid=27540602&inboundaltsenabled=false&infants=0&originentityid=27539525&outboundaltsenabled=false&preferdirects=false&preferflexible=false&ref=home&rtn=1"


$("div[class^='FlightsResults_dayViewItems'] > div[class^='EcoTicketWrapper_itineraryContainer'] > div[class^='FlightsTicket_container'] > [class^='FlightsTicket_link']").attr("href")

undefined

这是 function 迭代列表并获取每个列表的 URL。

async function scrapeListingUrl(listingURL) {
  try {
    const page = await browser.newPage();
    await page.goto(listingURL, { waitUntil: "networkidle2" });
    // await page.waitForNavigation({ waitUntil: "networkidle2" }); // Wait until page is finished loading before navigating
    console.log("Finished loading page.");

    const html = await page.evaluate(() => document.body.innerHTML);
    fs.writeFileSync("./listing.html", html);

    const $ = await cheerio.load(html); // Inject jQuery to easily get content of site more easily compared to using raw js

    // Iterate through flight listings
    // Note: Using regex to match class containing "FlightsResults_dayViewItems" to get listing since actual class name contains nonsense string appended to end.
    const bookingURLs = $('a[class*="FlightsTicket_link"]')
      .map((i, elem) => console.log(elem.href))
      .get();

    console.log(bookingURLs);
    return bookingURLs;
  } catch (error) {
    console.log("Scrape flight url failed.");
    console.log(error);
  }
}

Answer 1

使用地图（）

const hrefs = $(selector).map((i, elem) => elem.href).get()

查看您未使用 jQuery 的代码，因此上述代码不起作用。 因此，您只需使用一个基本选择器，该选择器将 class 的一部分与 querySelectorAll 匹配。 map 用于抓取href。

const links = [...document.querySelectorAll('a[class*="FlightsTicket_link"]')]
    .map(l=>l.href)