Axios配合Cheerio爬取网页仅获取父级div无法获取子div问题求助

AI 小北

2026-9-29

问题原因

你遇到的是服务端返回原始HTML和客户端渲染后DOM不一致的问题，核心原因如下：

axios 仅能获取站点服务器直接返回的初始静态HTML内容，不会执行页面附带的JavaScript代码。你在浏览器开发者工具中看到的完整DOM结构，是页面加载后本地JS执行、动态插入元素后的最终结果。
sl.se 采用了客户端渲染的架构，初始返回的HTML里仅包含你拿到的那些父级div容器，所有嵌套子div都是JS运行后动态生成的，自然无法用cheerio从初始HTML里提取到。
你测试的另一个站点aftonbladet是服务端直出全量DOM结构，初始HTML就包含所有层级的div，所以原有代码可以正常运行。

解决方案

有两种常用的解决路径：

方案1：使用支持JS执行的无头爬虫工具

替换原有axios+cheerio的组合，改用Puppeteer、Playwright这类可以模拟真实浏览器运行的工具，等页面JS执行完成后再提取DOM元素，示例代码如下：

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://sl.se/', {
    waitUntil: 'networkidle0' // 等待网络请求全部完成，确保JS执行完毕
  });
  // 提取所有div的class
  const divClasses = await page.evaluate(() => {
    return Array.from(document.querySelectorAll('div')).map(div => div.className);
  });
  console.log(divClasses);
  await browser.close();
})();