puppeteer 教程（5） ----入门例子（爬取csdn文章列表标题）

目标

爬取csdn文章列表标题

主要学习以下知识点

方法名称	方法说明
page.waitForSelector	等待某个元素出现
page.$$eval	此方法在页面内执行 Array.from(document.querySelectorAll(selector))，然后把匹配到的元素数组作为第一个参数传给 pageFunction

详细api 可参考
https://blog.csdn.net/mengxiangxingdong/article/details/99237204

开始

本文章代码均在 上传在
https://gitee.com/hugo110/puppeteer-demo

1.代码

/*
爬取csdn 博客的文章的标题
 */
const puppeteer = require('puppeteer'); //引入puppeteer库

(async () => {
    const browser = await puppeteer.launch({    //启动浏览器
        headless: false,   //代码运行时打开浏览器方便观察
        // devtools:true   //打开f12界面
    });
    const page = await browser.newPage();  //打开浏览器的一个tab 页
    await page.goto('https://blog.csdn.net/mengxiangxingdong', {timeout: 10 * 1000, waitUntil: 'networkidle2'});  //访问网址 只有2个网络连接时触发（至少500毫秒后）
    //等待某个元素出现，  这里我们要抓取文章，所以等待文章标题
    await page.waitForSelector('.article-list h4  a', {timeout: 10 * 1000});

    //开始解析每篇文章的标题
    //$$eval() 此方法在页面内执行 Array.from(document.querySelectorAll(selector))，然后把匹配到的元素数组作为第一个参数传给 pageFunction。
    let titleArr = await page.$$eval('.article-list h4  a', els => {
        let arr = new Array();
        //开始解析每篇文章的标题
        for (let i = 0, len = els.length; i < len; i++) {
            arr.push(els[i].innerText); //获取文章的标题
        }
        return arr;
    });
    // 输出获取的标题
    await  console.log('输出方法获取的标题');
    for (let i = 0, len = titleArr.length; i < len; i++) {
        await console.log(titleArr[i]);
    }
    await browser.close();  //关闭浏览器
})();

参考博客

https://zhaoqize.github.io/puppeteer-api-zh_CN/#?product=Puppeteer&version=v1.19.0&show=api-pageevalselector-pagefunction-args-1