跳到主要内容

欢迎使用 Cheerio！

让我们 先花 5 分钟快速了解一下 Cheerio 吧。

快速入门​

首先安装 Cheerio 及其依赖项。

设置 Node.js​

安装 Cheerio 前，你需要先安装 Node.js。

  • 下载最新版本的 Node.js：
    • 当安装 Node.js 时，建议你把所有依赖项的复选框都选上。 都选上。

安装 Cheerio​

安装好 Node.js 之后，你就可以使用以下命令来安装 Cheerio 了：

npm install cheerio

导入（import） Cheerio​

当安装完 Cheerio 之后，你就可以使用 import 语句将其导入到你的 JavaScript 代码中了：

import * as cheerio from 'cheerio';

如果你使用的事比较老的环境（或者喜欢是 CommonJS），还可以使用 require 函数：

const cheerio = require('cheerio');

使用 Cheerio​

导入（import） Cheerio 之后，你就可以使用它操作以及抓取 web 页面上的数据了。

加载文档​

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

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

上述代码将 HTML 字符串加载到 Cheerio 中并返回一个 Cheerio 对象。然后，你 就可以使用该对象遍历 DOM 并操作其中的数据了。

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

备注

Cheerio 不是浏览器。 Cheerio 解析文档中的标记（markup），并提供一组 API 来 遍历或操作返回的数据结构。Cheerio 对文档的解析 和浏览器不一样。具体来说，它 不 进行可视化的 渲染、不 加载并应用 CSS、不 加载外部资源、不 执行 JavaScript 代码（常见于单页应用中）。 这就使得 Cheerio 比其它方案 快很多很多。如果你的项目需要这些功能的话， 建议你考虑基于浏览器的自动化软件，例如 Puppeteer 和 Playwright，或 DOM 模拟类项目， 例如 JSDom。

选择元素​

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

下面，我们来选择 class 属性为 title 的 h2 元素，然后从中提取 文本内容。

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

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

遍历 DOM​

$ 函数的返回值是一个 Cheerio 对象，该对象类似于 DOM 元素 数组。可以使用该对象作为进一步遍历 DOM 的起点。例如，你可以使用 find 函数在已选取的元素中作 二次筛选：

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

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

操作元素​

选择一个元素之后，你可以使用 Cheerio 对象来 操作该元素。

下面，我们首先选择 class 属性为 title 的 h2 元素，然后修改 其文本内容。最后，我们还要在文档中新添加一个 h3 元素：

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

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

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