前言

前段时间,我发现一个开源题库,题目十分有意思。我想把它整成一个JSON文件做为数据储备,不便整活。

一共有一百五十多道题目,手动CV我必定是不想干的。于是写了个脚本,在写脚本的过程中,我发现一个能让Node.js操作Dom的开源我的项目。

有了它,再加上jQuery就能够应答简略爬虫抓取数据了,所以写下这篇文章跟大家分享下。

源码仓库地址:CatsAndMice/auto-script (github.com)

解析markdown文件获取数据

  • 读取markdown文件,去除无用的结尾内容

const readMd = (path) => {    let content = fs.readFileSync(path, { encoding: 'utf-8' });    content = content.split('---');    // 去除结尾无用结尾内容    content.shift(0, 1);    return content;}

markdown文件中每一段内容都是—-分隔,那就间接以它来宰割文件内容为若干块,第一块为结尾内容content.shift(0, 1)去除掉

  • 应用markdown-it将markdown内容渲染成html内容,这个时候的html仅仅是字符串,jsDom将html字符串转化成Dom
const mdIt = require('markdown-it')();const jsdom = require("jsdom");const { JSDOM } = jsdom;//...const parseMd = (md = '') => {    const mdHtml = mdIt.render(md)    const dom = new JSDOM(mdHtml)    const { window } = dom    return window}//...

实现markdown渲染成html字符串,html字符串转化成Dom后,间接把window这个变量返回进来即可。

  • 引入jQuery操作Dom
const getMdMapValue = (mds = []) => {    const mdMap = new Map();    mds.forEach((md, index) => {        const id = index + 1        const window = parseMd(md)        const $ = require('jquery')(window);        //...    })    return Array.from(mdMap.values())}
  • 接下来,即应用$ 针对性的获取Dom内容
const getMdMapValue = (mds = []) => {    const mdMap = new Map();    mds.forEach((md, index) => {        const id = index + 1        const window = parseMd(md)        const $ = require('jquery')(window);                //新增        const answer = parseAnswer($('p'))        const obj = { id, title: $('h6').text(), result: $('h4').text(), code: $('.language-javascript').text(), answer }        // 如果选项解析失败,则摈弃该题目        try {            parseSelect($('ul>li'), (key, value) => {                const option = { key, value }                if (obj.options) {                    obj.options.push(option)                    return                }                obj.options = [option]            })            mdMap.set(id, obj)        } catch (error) {            console.warn('解析出错:', error)        }                   })    return Array.from(mdMap.values())}

其余的逻辑就是将<code>、<em>等标签转化成`、**等markdown符号相干边界性问题解决,不具体粘贴代码,读者能够查看源码

写个小爬虫

我抉择爬取https://fabiaoqing.com/bqb/li... 网站的表情图,逻辑非常简单,几十行搞定。

还是应用jsDom将申请响应的html文件内容转化为Dom,再应用jQuery操作。

crawl.js

const axios = require('axios');const { JSDOM } = require('jsdom');let $ = require('jquery');const fs = require('fs');const path = require('path');(async () => {    const { data } = await axios.get('https://fabiaoqing.com/bqb/lists/type/hot.html')    const page = new JSDOM(data)    const window = page.window    $ = $(window)    $('.bqppdiv').each(async (index, e) => {        const src = $(e).find('.image')[0].getAttribute('data-original')        const type = path.extname(src)        const fileName = Date.now() + type        const { data } = await axios.get(src, {responseType: 'stream'})        const download = path.join(__dirname, fileName)        data.pipe(fs.createWriteStream(download))    })})()

这里,我仅演示下爬虫不再深刻,相似简略爬虫仅应用jquery、jsDom即可搞定,不须要学习其余简单的爬虫工具。

总结

通过解析markdown文件将纯markdown文本解析成html字符串,又将html字符串转化成实在的Dom对象,再应用jQuery来获取Dom,达成markdown文件内信息转成JSON文件作为数据存储的目标,最初演示NodeJs操作Dom,并简略写一个爬虫做为练习。

如果我的文章对你有帮忙,你的就是对我的最大反对^_^,另外欢送大家关注我的公众号《凌览社》,和我一起成长。

本文由mdnice多平台公布