使用 Cheerio 加载和操作 HTML 片段字符串-js教程-PHP中文网

使用 Cheerio 加载和操作 HTML 片段字符串

心靈之曲

发布： 2025-07-14 18:18:12

原创

240人浏览过

使用 cheerio 加载和操作 html 片段字符串

本文将介绍如何使用 Cheerio 库加载和操作 HTML 片段字符串，并避免 Cheerio 默认将其包裹在完整的 HTML 文档结构中。通过配置 cheerio.load() 函数的参数，我们可以直接访问和操作 HTML 片段，从而更方便地进行后续处理。

Cheerio 是一个为服务器特别定制的快速、灵活、简洁的 jQuery 核心实现。它非常适合从 HTML 文档中提取和操作数据。然而，默认情况下，当使用 cheerio.load() 函数加载 HTML 字符串时，Cheerio 会将其包装在一个完整的 HTML 文档结构中，这在某些情况下可能会带来不便。

例如，以下代码：

const cheerio = require('cheerio');

const htmlString = '<div class="artist"><i class="user blue circle icon"></i> Skyy</div>';
const $ = cheerio.load(htmlString);
console.log($.html());

登录后复制

输出结果为：

PPT.CN,PPTCN,PPT.CN是什么,PPT.CN官网,PPT.CN如何使用

一键操作，智能生成专业级PPT

查看详情

立即学习“前端免费学习笔记（深入）”；

<html><head></head><body><div class="artist"><i class="user blue circle icon"></i> Skyy</div></body></html>

登录后复制

可以看到，原始的 HTML 片段被 Cheerio 包装在了 <html>, <head>, <bodyyoujiankuohaophpcn 等标签中。这使得直接访问和操作该片段变得稍微复杂。

为了避免这种情况，可以使用 cheerio.load() 函数的第三个参数，将其设置为 false。该参数用于禁用 HTML 包装。

以下是修改后的代码：

const cheerio = require('cheerio');

const htmlString = '<div class="artist"><i class="user blue circle icon"></i> Skyy</div>';
const $ = cheerio.load(htmlString, null, false);
console.log($.html());

登录后复制

输出结果为：

立即学习“前端免费学习笔记（深入）”；

<div class="artist"><i class="user blue circle icon"></i> Skyy</div>

登录后复制

现在，输出结果就是原始的 HTML 片段，没有被额外的 HTML 标签包裹。

详细解释：

cheerio.load() 函数的完整签名为：

cheerio.load(html, options, isDocument);

登录后复制

html: 要加载的 HTML 字符串。
options: 一个可选的配置对象，用于指定 Cheerio 的行为。可以设置为 null 使用默认选项。
isDocument: 一个布尔值，指定是否将 HTML 字符串视为完整的 HTML 文档。将其设置为 false 可以禁用 HTML 包装。

示例：

以下示例展示了如何使用禁用 HTML 包装来提取 HTML 片段中的文本内容：

const cheerio = require('cheerio');

const htmlString = '<div class="artist"><i class="user blue circle icon"></i> Skyy</div>';
const $ = cheerio.load(htmlString, null, false);

const artistName = $('.artist').text();
console.log(artistName); // 输出：Skyy

登录后复制

总结：

通过使用 cheerio.load() 函数的第三个参数并将其设置为 false，可以有效地禁用 Cheerio 的 HTML 包装功能，从而更方便地加载和操作 HTML 片段字符串。这在处理不完整的 HTML 片段或需要直接访问特定节点时非常有用。请记住，第二个参数通常设置为 null 以使用默认选项，而第三个参数控制是否将其作为完整的 HTML 文档加载。

以上就是使用 Cheerio 加载和操作 HTML 片段字符串的详细内容，更多请关注php中文网其它相关文章！