Node.js 中的 HTML 解析：顶级库与代码示例

JavaScript (Node.js) 中的 HTML 解析：完整指南

HTML 解析是开发解析器（web scraper）和自动化数据收集时的关键任务之一。在 Node.js 生态系统中，有多个强大的库可用于从 HTML 文档中提取信息。本文将介绍三种主要工具：Cheerio、JSDOM 和 Puppeteer，比较它们的功能，并提供实际代码示例。

1. Cheerio — 轻量级的服务端 jQuery

Cheerio 是 Node.js 中最流行的 HTML 解析库。它实现了 jQuery 语法，但无需浏览器环境即可运行，因此速度快且内存占用低。Cheerio 非常适合无需执行 JavaScript 的静态 HTML 页面。

安装

npm install cheerio

使用示例

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

async function parsePage(url) {    const response = await axios.get(url);    const $ = cheerio.load(response.data);

    // 提取页面标题    const title = $('h1').text().trim();

    // 收集所有链接    const links = [];    $('a').each((i, el) => {        const href = $(el).attr('href');        if (href) links.push(href);    });

    return { title, links };}

// 使用parsePage('https://example.com').then(data => console.log(data));

何时选择 Cheerio：

• 无动态内容的静态页面
• 对性能要求较高
• 简单的 jQuery 语法
• 无需 JavaScript 渲染

2. JSDOM — 完整的 DOM 实现

JSDOM 模拟浏览器环境，创建完整的 DOM 模型。与 Cheerio 不同，JSDOM 支持执行 JavaScript，因此可以解析由脚本生成内容的页面。但这是以功能为代价的——该库消耗更多资源。

安装

npm install jsdom

使用示例

const { JSDOM } = require('jsdom');

async function parseDynamicPage(html) {    const dom = new JSDOM(html, {        runScripts: 'dangerously',        resources: 'usable'    });

    const document = dom.window.document;

    // 等待脚本执行    await new Promise(resolve => setTimeout(resolve, 2000));

    const items = [];    document.querySelectorAll('.product-item').forEach(el => {        items.push({            name: el.querySelector('.product-name')?.textContent,            price: el.querySelector('.price')?.textContent        });    });

    return items;}

// 传递 HTML 的示例const html = `<html><body><div class="product-item">...</div></body></html>`;parseDynamicPage(html).then(data => console.log(data));

何时选择 JSDOM：

• 包含动态内容的页面（AJAX、React、Vue）
• 需要处理 DOM 事件
• Web 应用测试
• 从 SPA（单页应用）中提取数据

3. Puppeteer — 代码控制的浏览器

Puppeteer 是一个完整的无头浏览器（Chrome/Chromium），可通过编程方式控制。它执行 JavaScript、加载资源、处理 Cookie 和会话。Puppeteer 是最强大的工具，但也是资源消耗最大的。

安装

npm install puppeteer

使用示例

const puppeteer = require('puppeteer');

async function parseWithBrowser(url) {    const browser = await puppeteer.launch({ headless: true });    const page = a