如何用NodeJS+Cheerio抓取无类/ID的div中span包裹的标题与描述？

遍历a标签的方案是否可行？ #

完全可行——只要目标span和a标签存在明确的DOM层级关联（比如a是span的父/祖先节点，或a与span同属目标div下的兄弟节点），就可以通过遍历a标签来定位到对应的span文本。核心是利用DOM结构的关联性来替代类名/ID定位。

具体实现代码 #

场景1：直接定位专属span（优先推荐） #

既然你提到这些span是仅用于目标内容的，那可以通过目标div的位置+span的组合选择器来定位，比如假设目标div是页面中前5个符合特定层级的div：

const axios = require('axios');
const cheerio = require('cheerio');

async function extractContent() {
  try {
    // 替换为目标网站URL
    const response = await axios.get('https://target-website.com');
    const $ = cheerio.load(response.data);

    // 定位前5个目标div下的专属span，根据实际DOM结构调整选择器
    const targetSpans = $('div:nth-child(-n+5) span'); 
    const results = [];

    targetSpans.each((index, element) => {
      const text = $(element).text().trim();
      // 若标题和短描述是同div下的两个span，可调整为：
      // const title = $(element.parent).find('span').eq(0).text().trim();
      // const desc = $(element.parent).find('span').eq(1).text().trim();
      results.push({
        index: index + 1,
        content: text
      });
    });

    console.log('提取结果:', results);
  } catch (error) {
    console.error('抓取失败:', error.message);
  }
}

extractContent();

场景2：遍历a标签的方案 #

如果目标span嵌套在a标签内部，或者a标签与span同属目标div下，可通过遍历a标签来关联到span：

const axios = require('axios');
const cheerio = require('cheerio');

async function extractViaATags() {
  try {
    const response = await axios.get('https://target-website.com');
    const $ = cheerio.load(response.data);

    // 遍历目标div下的a标签，根据实际结构调整选择器
    const targetLinks = $('div:nth-child(-n+5) a');
    const results = [];

    targetLinks.each((index, link) => {
      // 提取a标签内的span文本，按位置区分标题和短描述
      const title = $(link).find('span').eq(0).text().trim();
      const shortDesc = $(link).find('span').eq(1).text().trim();
      
      results.push({
        index: index + 1,
        title: title,
        shortDesc: shortDesc
      });
    });

    console.log('提取结果:', results);
  } catch (error) {
    console.error('抓取失败:', error.message);
  }
}

extractViaATags();

关键调整点 #

• 你需要根据目标网站的实际DOM结构，修改选择器中的层级关系（比如div:nth-child(-n+5)可能需要换成更精准的层级，比如main > section > div:nth-child(-n+5)）。
• 如果标题和短描述是分开的两个span，可以通过eq(index)、文本长度或位置特征来区分提取。

内容的提问来源于stack exchange，提问作者denisucu55