简介：

cheerio 是一个HTML解析器，cheerio实现了核心jQuery的子集。常用来解析采集来的HTML数据。

安装：

npm install cheerio

基础使用：

const cheerio = require('cheerio');

var htmlString = `<ul id="fruits">
 <li class="apple">苹果</li>
 <li class="orange">橙子</li>
 <li class="pear">梨</li>
</ul>`;
$ = cheerio.load(htmlString);

$('.apple', '#fruits').text()
//=> 苹果

$('ul .pear').attr('class')
//=> 梨

$('li[class=orange]').html()
//=> 橙子

选择器

cheerio和jQuery选择器的实现几乎是相同的,所以API非常相似。

$( selector, [context], [root] )

selector 在 root 的范围内搜索 context 。selector和context可以是一个字符串表达式,DOM元素,DOM元素的数组,或cheerio对象。root 通常是HTML文档字符串。

属性

获取和修改属性的方法。

.attr( name, value )

获取和设置属性的方法。在匹配集合中只能获取的第一个元素的属性值。如果你把属性值设置为空，就会删除该属性。你也可以像jQuery函数一样通过传递键值 和 函数来设置。

.data( name, value )

获取和设置数据属性的方法。获取或设置仅在匹配集合中的第一个元素的数据属性值。

.val( [value] )

获取和设置input, select, and textarea的值的方法。注：对于传递键值,函数的支持尚未实现。

.hasClass( className )

检查任何一个匹配的元素中是否有className。

.addClass( className )

在所有匹配的元素中添加类。也像jQuery函数一样接受函数。

.removeClass( [className] )

从选定的元素中删除一个或多个空格分隔的class。如果removeClass函数的className是未定义的(即未传参数)，所有的class值会被删除。也像jQuery函数一样接受函数。

查询

.find(selector)

通过选择器、jQuery对象或元素来过滤，获取每个匹配元素的后代。

.parent([selector])

获得每个匹配元素的parent,可选择性的通过selector筛选。

$('.pear').parent().attr('id')
//=> fruits

.parents([selector])

获得通过选择器筛选匹配的元素的parent集合。

$('.orange').parents().length
// => 2
$('.orange').parents('#fruits').length
// => 1

.next([selector])

获取他的下一个兄弟节点。

$('.apple').next().hasClass('orange')

//=> true

.nextAll([selector])

获取在他的后面的所有兄弟节点。

.prev([selector])

获取选定元素的前一个兄弟节点，可以选择一个选择器筛选。

.prevAll([selector])

获取在指定元素的前面的所有兄弟节点。

.siblings([selector])

获取选定元素的所有兄弟，不包括它自己(可以通过传入class改变筛选结果)。

.children([selector])

获取选定元素的孩子元素。

.contents()

获取匹配元素集合中的每个元素的孩子元素，包括文本和注释节点。

.each( function(index, element) )

迭代一个cheerio对象，为每个匹配元素执行一个函数。当回调函数执行后，该函数所处的环境是DOM element，所以this指向当前元素，这相当于函数的参数element。要提前打破的each循环，那么返回false。

var fruits = [];
$('li').each(function(i, elem) {
 fruits[i] = $(this).text();
});

.map( function(index, element) )

通过每个在匹配函数产生的匹配集合中的匹配元素，产生一个新的包含返回值的cheerio对象。

.filter( function(index) )

遍历一个cheerio对象，降低通过选择器匹配的元素，或传递函数的测试的选择器元素组。

.not( selector )

结果中不匹配选择器的元素将被包含在该结果中。

选择器:

$('li').not('.apple').length;

.has( selector )

匹配一个拥有指定孩子元素的父元素。相当于.filter(':has(selector)')。

.first()

选择一个cheerio的对象的第一个元素

$('#fruits').children().first().text()
//=> Apple

.last()

选择一个cheerio对象的最后一个元素

$('#fruits').children().last().text()
//=> Pear

.eq( i )

根据索引（0开始）来确定元素。使用 .eq(-i) 的则是倒过来计数。

.add( selector [, context] )

在匹配元素集合中添加元素。

.append( content, [content, ...] )

插入内容为每个选定元素的 last 孩子。

$('ul').append('<li class="plum">Plum</li>')
$.html()
//=> <ul id="fruits">
//   <li class="apple">Apple</li>
//   <li class="orange">Orange</li>
//   <li class="pear">Pear</li>
//   <li class="plum">Plum</li>
//  </ul>
.appendTo( target )

.insertAfter( target )

将每一个元素插入匹配元素集合中的目标后。

.before( content, [content, ...] )

在匹配元素集合的元素前插入元素。

.remove( [selector] )

将匹配的元素集合从DOM和他们的孩子节点中删除。

.html( [htmlString] )

获取第一个选中元素的HTML内容字符串。如果htmlstring被指定，那么选中元素的内容被新内容所取代。

.text( [textString] )

获取元素集合中的每个元素的合并文本内容，包括它们的后代。如果 textString 指定文本字符串，每个元素的内容被新的内容替换。

.css( [propertName] )

得到一个匹配元素的style属性值或者设置匹配元素的css属性。

参考：

https://github.com/cheeriojs/cheerio/wiki/Chinese-README

修改时间 2022-02-28