美文网首页Web Developer
An example of front-end spider

An example of front-end spider

作者: 方寸拾光 | 来源:发表于2018-10-23 19:43 被阅读0次

    初衷

    由于老婆是一个追求极致高效(看她工作辛苦💦)工作的新媒体运营,于是请求我看能不能帮她简化流程。作为一名爱老婆的前端攻城狮,这怎么能难得到我。三下五除二(还是查了不少网上的代码,毕竟外号:代码搬运工嘛)就撸出了下面的代码。

    代码解释

    原本打算用后端node爬取的,但研究了一番后发现,不能满足夫人翻页的需求,于是采用前端爬取的方案,虽然多了一些体力活,但相比原先的纯手工打造还是进化了不知多少个世纪(嘿嘿😁)呢!
    代码中运用到了jquery,ES6的写法。

    Talk is cheap,show me the code!

    // 1 step
    const script = document.createElement("script");
    script.src = "https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js";
    const s = document.getElementsByTagName("script")[0];
    s.parentNode.insertBefore(script, s);
    
    // 2 step
    let arr = [],
        page = 2,
        sequence = 1;
    
    const currentCrawl = () => {
        $('.figures_list li').each(function (index, item) {
            let title = $(this).find('strong a').text(),
                reading = $(this).find('.figure_info .info_inner').text(),
                time = $(this).find('.figure_info .figure_info_time').text();
            if (reading.includes('万')) {
                reading = reading.replace('万', '') * 10000;
            }
            arr.push({'id': sequence, 'title': title, 'reading': reading, 'time': time});
            sequence++;
        });
        console.log(`爬取第${page - 1}页成功,正在跳转第${page}页`);
        $('.page_next')[0].click();
        page++
    };
    
    const tableToExcel = () => {
        console.log(`正在导出数据`);
        //列标题,逗号隔开,每一个逗号就是隔开一个单元格
        let str = `序号,标题,浏览量,时间\n`;
        //增加\t为了不让表格显示科学计数法或者其他格式
        for (let i = 0; i < arr.length; i++) {
            for (let item in arr[i]) {
                str += `${arr[i][item]},`;
            }
            str += '\n';
        }
        //encodeURIComponent解决中文乱码
        let uri = 'data:text/csv;charset=utf-8,\ufeff' + encodeURIComponent(str);
        //通过创建a标签实现
        let link = document.createElement("a");
        link.href = uri;
        //对下载的文件命名
        link.download = "数据表.csv";
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
    }
    
    //爬取当前页
    currentCrawl();
    //导出数据
    tableToExcel();
    

    相关文章

      网友评论

        本文标题:An example of front-end spider

        本文链接:https://www.haomeiwen.com/subject/letzzftx.html