Javascript document.querySelectorAll()不适用于无限滚动

时间:2019-12-04 10:02:21

标签: javascript web-scraping puppeteer

我正在尝试构建一个简单的Web抓取工具。我尝试抓取的数据具有无限滚动。以下是我正在使用的功能:

async function scrapeInfiniteScrollItems(page,extractItems,itemTargetCount,scrollDelay = 1000) {
    let items = [];
    try {
      let previousHeight;
      while (items.length < itemTargetCount) {
        items = await page.evaluate(extractItems);
        previousHeight = await page.evaluate('document.body.scrollHeight');
        await page.evaluate('window.scrollTo(0, document.body.scrollHeight)');
        await page.waitForFunction(`document.body.scrollHeight > ${previousHeight}`);
        await page.waitFor(scrollDelay);
      }
    } catch(e) { console.log(e)}
    return items; ---> items.length is Always 42, It should be 482
}

以下是我的 extractItems 函数:

function extractItems(){
    postLinksArray = [];
    let postsArray = document.querySelectorAll('.v1Nh3'); -->class name
    console.log(postsArray.length);
    for(var post of postsArray){
        let postLink = post.getElementsByTagName('a')[0].getAttribute('href');
        postLinksArray.push(postLink);  
    }
    return postLinksArray;
}

如您所见,它很简单,我正在使用puppeteer库。在scrapeInfiniteScrollItems函数返回之后。 items数组的长度始终为42。应为482。您能告诉我我在做什么错吗?

1 个答案:

答案 0 :(得分:0)

似乎每次循环使用以下行:<html> <style> #container { margin:0 auto; text-align: center; } #first { float: left; } #second { float: left; } #clear { clear: both; } #space{ width:20px; height:20px; float: left; } .table, .table th, .table td{ border: 1px solid black; } </style> <body> <table id = "container" > <td> <div id="first"> <table class="table"> <tr> <th>Column1</th> <th>Column2</th> </tr> <tr> <td>Value1</td> <td>Value2</td> </tr> </table> </div> <div id = "space" > </div> <div id = "second" > <table class="table"> <tr> <th>Column1</th> <th>Column2</th> </tr> <tr> <td>Value1</td> <td>Value2</td> </tr> </table> </div> <div id = "clear" ></div> </div> </td> </table> </body> </html>时,您都在覆盖items数组。如果您希望所有项目都在数组中,请使用items = await page.evaluate(extractItems),如下所示:

.push

或尝试类似以下功能:

let newItems = await page.evaluate(extractItems);
items.push(newItems);

这样,当您返回数组时,所有项目都应存在于数组中。