使用cheerio爬取网页时如何获取嵌套类元素的文本并解决空行问题

问题原因 #

你使用的children()方法仅能匹配当前节点的直接一级子元素，从提供的HTML结构可以看到，.latest-jobs-title和.ago-text类的元素都属于职位容器的多层嵌套后代节点，不属于直接子元素，因此无法匹配到对应节点，才会输出空行。

修正方案 #

将children()替换为find()方法即可，find()可以匹配当前节点下所有层级的后代元素，修正后代码如下：

const request = require('request')
const cheerio = require('cheerio')

const url = 'https://www.temp.com/jobs'

request(url, (error, response, html) => {
    if (!error && response.statusCode == 200){
        const $ = cheerio.load(html);
        // 匹配所有职位容器
        const temp = $('.col-md-12.col-lg-12.col-xs-12.padding-none.job-container.jobs-on-hover')
        temp.each(function (i, e) {
            // 获取职位标题文本
            const jobTitle = $(this).find('.latest-jobs-title.font-16.margin-none.inline-block').text().trim()
            // 获取发布时间文本
            const postTime = $(this).find('.ago-text').text().trim()
            console.log('职位名称：', jobTitle, '发布时间：', postTime)
        });
    }
})

补充说明 #

• 额外加了trim()方法，可以去除文本前后的多余空白字符、换行符，避免输出冗余内容
• 如果需要同时获取职位下的其他字段，也可以按照相同逻辑调用find()方法匹配对应类名的元素即可

内容的提问来源于stack exchange，提问作者Go For Pro