Pilih/ekstrak nod html/teks daripada HTML menggunakan pemilih CSS

Question

Andaikan saya sedang menulis skrip nod yang menggunakan fetch untuk mendapatkan semula kandungan halaman html ke dalam pembolehubah.

Kini saya mempunyai pemilih CSS untuk jenis kandungan ini. Bagaimanakah saya boleh menggunakan ini untuk mengekstrak kandungan html dan/atau teks yang diiktiraf oleh pemilih CSS.

Jika ada alatan/pakej sedia ada yang boleh saya manfaatkan, sila berikan jawapan dua tahap:

1. Berdasarkan pemilih CSS tulen
2. alat berasaskan jQuery

Answer 1

Untuk mengekstrak kandungan HTML/teks yang dikenal pasti oleh pemilih CSS dalam Node.js, anda boleh menggunakan pelbagai pakej seperti Cheerio, jsdom atau Puppeteer. Berikut ialah contoh cara menggunakan pemilih CSS untuk mengekstrak kandungan bagi alatan berasaskan pemilih CSS tulen dan berasaskan jQuery:

Berdasarkan pemilih CSS tulen: Cheerio ialah pakej pantas dan fleksibel yang menghuraikan HTML dan membolehkan anda menggunakan pemilih CSS untuk mengekstrak data. Begini cara menggunakan Cheerio untuk mengekstrak kandungan melalui pemilih CSS:

const cheerio = require('cheerio');
const html = '
Hello World!
';

const $ = cheerio.load(html);
const content = $('.content').text();

console.log(content); // Output: Hello World!

Alat berasaskan jQuery: Jika anda lebih suka sintaks jQuery, anda boleh menggunakan pakej seperti jQuery atau JSDOM. Berikut ialah contoh menggunakan jQuery:

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

const html = '
Hello World!
';
const dom = new JSDOM(html);
const $ = require('jquery')(dom.window);

const content = $('.content').text();

console.log(content); // Output: Hello World!

Dalam kedua-dua contoh, kami mula-mula memuatkan kandungan HTML menggunakan pakej (Cheerio atau JSDOM) dan kemudian menggunakan pemilih CSS untuk memilih kandungan yang kami mahu. Akhir sekali, kami mengekstrak teks elemen yang dipilih menggunakan kaedah text().