跳至主要内容

欢迎来到 Cheerio！

让我们快速了解一下 不到 5 分钟就能学会的 Cheerio。

入门​

让我们安装 Cheerio 及其依赖项。

设置 Node.js​

要安装 Cheerio，你需要在你的系统上安装 Node.js。

  • 下载最新版本的 Node.js
    • 安装 Node.js 时，建议勾选所有与依赖项相关的复选框。

安装 Cheerio​

安装好 Node.js 后，你可以使用以下命令安装 Cheerio

npm install cheerio

导入 Cheerio​

安装好 Cheerio 后，你可以使用 import 语句将其导入你的 JavaScript 代码中

import * as cheerio from 'cheerio';

如果你使用的是较旧的环境（或更喜欢使用 CommonJS），可以使用 require 函数

const cheerio = require('cheerio');

使用 Cheerio​

导入 Cheerio 后，你可以开始使用它来操作和抓取网页数据。

加载文档​

加载 HTML 最简单的方法是使用 load 函数

const $ = cheerio.load('<h2 class="title">Hello world</h2>');

这将把 HTML 字符串加载到 Cheerio 中，并返回一个 Cheerio 对象。然后你可以使用这个对象来遍历 DOM 并操作数据。

了解更多关于 加载文档 的信息。

注意

Cheerio 不是一个网页浏览器。 Cheerio 解析标记并提供一个 API 用于遍历/操作生成的数据结构。它不会像网页浏览器那样解释结果。具体来说，它不会生成视觉渲染、应用 CSS、加载外部资源或执行 JavaScript，而这些功能是 SPA（单页应用程序）的常见功能。这使得 Cheerio 比其他解决方案快得多。如果你的用例需要这些功能中的任何一个，你应该考虑使用浏览器自动化软件，如 Puppeteer 和 Playwright，或使用 DOM 模拟项目，如 JSDom。

选择元素​

加载好文档后，你可以使用返回的函数来选择文档中的元素。

在这里，我们将选择具有类 title 的 h2 元素，然后获取它的文本

$('h2.title').text(); // "Hello world"

了解更多关于 选择元素 的信息。

遍历 DOM​

$ 函数返回一个 Cheerio 对象，它类似于一个 DOM 元素数组。可以将这个对象作为起点进一步遍历 DOM。例如，可以使用 find 函数选择所选元素内的元素

$('h2.title').find('.subtitle').text();

还有许多其他函数可以用来遍历 DOM。了解更多关于 遍历 DOM 的信息。

操作元素​

选择好元素后，可以使用 Cheerio 对象来操作该元素。

在这里，我们将选择具有类 title 的 h2 元素，然后更改其内部的文本。我们还将一个新的 h3 元素添加到文档中

$('h2.title').text('Hello there!');

$('h2').after('<h3>How are you?</h3>');

了解更多关于 操作元素 的信息。