HTML-Parsing in Node.js: Top-Bibliotheken und Codebeispiele

HTML-Parsing in JavaScript (Node.js): Vollständiger Leitfaden

HTML-Parsing ist eine der Kernaufgaben bei der Entwicklung von Parsern (Web Scrapern) und der Automatisierung der Datenerfassung. Im Node.js-Ökosystem gibt es mehrere leistungsstarke Bibliotheken, mit denen Informationen aus HTML-Dokumenten extrahiert werden können. In diesem Artikel betrachten wir drei Hauptwerkzeuge: Cheerio, JSDOM und Puppeteer, vergleichen ihre Funktionen und geben praktische Codebeispiele.

1. Cheerio – leichtgewichtiges jQuery für den Server

Cheerio ist die beliebteste Bibliothek zum HTML-Parsing in Node.js. Sie implementiert die jQuery-Syntax, arbeitet jedoch ohne Browserumgebung, was sie schnell und speicherschonend macht. Cheerio eignet sich hervorragend für statische HTML-Seiten, bei denen keine JavaScript-Ausführung erforderlich ist.

Installation

npm install cheerio

Anwendungsbeispiel

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

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

    // Seitentitel extrahieren    const title = $('h1').text().trim();

    // Alle Links sammeln    const links = [];    $('a').each((i, el) => {        const href = $(el).attr('href');        if (href) links.push(href);    });

    return { title, links };}

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

Wann Cheerio wählen:

• Statische Seiten ohne dynamischen Inhalt
• Hohe Leistungsanforderungen
• Einfache jQuery-Syntax
• Keine Notwendigkeit für JavaScript-Rendering

2. JSDOM – vollwertige DOM-Implementierung

JSDOM emuliert eine Browserumgebung und erstellt ein vollwertiges DOM-Modell. Im Gegensatz zu Cheerio unterstützt JSDOM die Ausführung von JavaScript, was das Parsen von Seiten ermöglicht, deren Inhalt durch Skripte generiert wird. Dies geht jedoch zu Lasten der Funktionalität – die Bibliothek verbraucht mehr Ressourcen.

Installation

npm install jsdom

Anwendungsbeispiel

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

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

    const document = dom.window.document;

    // Auf Ausführung der Skripte warten    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;}

// Beispiel mit HTML-Übergabeconst html = `<html><body><div class="product-item">...</div></body></html>`;parseDynamicPage(html).then(data => console.log(data));

Wann JSDOM wählen:

• Seiten mit dynamischem Inhalt (AJAX, React, Vue)
• Notwendigkeit der Arbeit mit DOM-Ereignissen
• Testen von Webanwendungen
• Datenextraktion aus SPAs (Single Page Applications)

3. Puppeteer – browser under code control

Puppeteer ist ein vollwertiger Headless-Browser (Chrome/Chromium) mit programmatischer Steuerung. Er führt JavaScript aus, lädt Ressourcen, verarbeitet Cookies und Sitzungen. Puppeteer ist das leistungsstärkste Werkzeug, aber auch das ressourcenintensivste.

Installation

npm install puppeteer

Anwendungsbeispiel

const puppeteer = require('puppeteer');

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