Как мне создать файл CSV из всех этих элементов?

Question

Я пытаюсь получить текст из обоих этих разделов и превратить его в список CSV от кукловода:

номер товара: (Item 1055688)

цена: ($ 16,59)

вот что я пробовал, но, похоже, не получается найти SKU, например:

let elements = await.self.page.$$('div[class="row item-row"]');
for (let element of elements) {
    let sku = await element.$eval(('div[class="body-copy custom-body- 
copy"]'), node => node.innerText.trim());
}

Вот код, из которого я пытаюсь извлечь данные:

<div class="col-xl-3 col-lg-3 col-md-6 col-sm-8 col-xs-6">
<div class="product_desc_txt">

    <a href=" https://www.costcobusinessdelivery.com/.product.1055688.html 
" class="body-copy-link">
        Pringles Snack Pack Potato Crisps, Original, 0.67 oz, 60 ct
    </a>
    <div class="body-copy custom-body-copy">
       Item&nbsp;1055688
    </div>

    <div class="margin_tp_10"></div>

    <div class="body-copy hidden visible-md visible-sm visible-xs 
visible-lg">

        <span  data-wishlist-linkfee="false" > $16.59</span>

    </div>

</div>
</div>
<div class="col-xl-2 col-lg-2 body-copy text-right hidden visible-xl ">

<span  data-wishlist-linkfee="false" > $16.59</span>


</div>

Вот мой код:

const puppeteer = require("puppeteer-extra")

const pluginStealth = require("puppeteer-extra-plugin-stealth")
puppeteer.use(pluginStealth())

puppeteer.launch({ headless: false }).then(async browser => {
const page = await browser.newPage()
await page.setViewport({ width: 1920, height: 1080 })
await page.goto("https://www.costcobusinessdelivery.com")
await page.waitFor(5000);
await page.waitForSelector("#header_sign_in");
await page.click("#header_sign_in");
await page.waitForSelector("#logonId");

await page.type('#logonId', 'username', {delay: 20});
await page.type('#logonPassword_id', 'password', {delay: 20});
await page.type('#deliveryZipCode', 'zipcode', {delay: 20});
await page.click('#sign_in_button');

await page.waitForSelector('body > div.bd-specific > div > div > div > div > div > ul > li.set-zip-code.left-lg.colo-md-5.zipped > ul > li:nth-child(1) > a');
await page.click('body > div.bd-specific > div > div > div > div > div > ul > li.set-zip-code.left-lg.colo-md-5.zipped > ul > li:nth-child(1) > a');
await page.waitForSelector('#tiles-body-attribute > div:nth-child(2) > div.myaccount-lists > div > div:nth-child(2) > div > span > h5 > a');
await page.click('#tiles-body-attribute > div:nth-child(2) > div.myaccount-lists > div > div:nth-child(2) > div > span > h5 > a');

Я новичок в кукловоде, поэтому я не уверен, что я делаю это правильно вообще, любая помощь или руководство будут оценены. Спасибо!

Answer 1

Я полагаю, что структура вашей страницы похожа на эта

В этом случае вы можете использовать следующий код:

// Find product descriptions
const csv = await page.$$eval('.product_desc_txt', function(products){

    // Iterate over product descriptions
    let csvLines = products.map(function(product){

        // Inside of each product find product SKU and its price
        let productId = product.querySelector(".custom-body-copy").innerText.trim();
        let productPrice = product.querySelector("span[data-wishlist-linkfee]").innerText.trim();

        // Fomrat them as a csv line
        return `${productId};${productPrice}`
    })

    // Join all lines into one file
    return csvLines.join("\n");

});

Этот код сструктура связанного HTML производит это:

Item 1055688; $ 16.59
Item 1055688; $ 16.59
Item 1055688; 16.59
Item 1055688; 16.59

---

Более компактный способ переписать это с помощью функций со стрелками был бы следующим: (хотя я не думаю, что это очень читабельно)

const csv = await page.$$eval('.product_desc_txt', products => products.map(product => product.querySelector(".custom-body-copy").innerText.trim() + ";" + product.querySelector("span[data-wishlist-linkfee]").innerText.trim()).join("\n"));