Skip to content

Instantly share code, notes, and snippets.

@odevodyssey
Created October 25, 2019 03:16
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 2 You must be signed in to fork a gist
  • Save odevodyssey/1b2a140b447617563e7d4e8c737e9456 to your computer and use it in GitHub Desktop.
Save odevodyssey/1b2a140b447617563e7d4e8c737e9456 to your computer and use it in GitHub Desktop.
Examples of Cheerio.js methods and their usage
const cheerio = require('cheerio')
const responseBody = "<?xml version='1.0' encoding='us-ascii'?> \
<!-- A SAMPLE set of slides --> \
<soap-env:envelope> \
<soap-env:header> \
<wsse:security xmlns:wsse=\"http://docs.oasis-open.org/wss/2004/01/oasis-200401-wss-wssecurity-secext-1.0.xsd\">Assertion Here</wsse:security> \
</soap-env:header> \
<soap-env:body> \
<slideshow \
title=\"Sample Slide Show\" \
date=\"Date of publication\" \
author=\"Yours Truly\" \
> \
<!-- TITLE SLIDE --> \
<slide type=\"first\"> \
<title>Wake up to WonderWidgets!</title> \
</slide> \
<!-- OVERVIEW --> \
<slide type=\"second\"> \
<title>Overview</title> \
<item>Why <em>WonderWidgets</em> are great</item> \
<item/> \
<item>Who <em>buys</em> WonderWidgets</item> \
</slide> \
<slide type=\"third\"> \
<title>I am the thirdest titlest</title> \
</slide> \
</slideshow> \
</soap-env:body> \
</soap-env:envelope>"
const $ = cheerio.load(responseBody, {
ignoreWhitespace: true,
xmlMode: true
});
// Render XML
console.log($.xml())
// Get slideshow node
let slideshow = $('slideshow')
// Get author attribute of slideshow node
console.log($('slideshow').attr('author'))
// Set author attribute node to Andrew
console.log($('slideshow').attr('author', 'Andrew').html())
// Remove date attribute of slideshow node
$('slideshow').removeAttr('date')
// Check if nodes are the same
console.log($('slideshow').is('slideshow[title="Sample Slide Show"]'))
console.log($('slideshow').is('slideshow'))
// Find slide node under slideshow, matches to first occurence
console.log($('slideshow').find('slide').length)
// Find slide node, matching on type attribute equal to "second"
console.log($('slideshow').find('slide[type="second"]').length)
// Get parent node of slide, get it's attribute
console.log($('slideshow').find('slide').parent().attr('author'))
// Get parent node of slide, match by slideshow node attribute equal to "Sample Slide Show"
console.log($('slideshow').find('slide').parents('slideshow[title="Sample Slide Show"]').length)
// Get all chidren of slideshow node
console.log($('slideshow').children().length)
// Get child node of slideshow where attribute type of slide node equals "second"
console.log($('slideshow').children('slide[type="second"]').html())
// Get next node after first occurence of slide node under slideshow node
console.log($('slideshow').find('slide').next().html())
// Get previous node of slide node where type attribute equals "second"
console.log($('slideshow').find('slide[type="second"]').prev().html())
// For each node in slideshow return text of each node in an array, and join them all with a space
console.log($('slideshow').map(function(i, el) {
// this === el
return $(this).text();
}).get().join(' '));
// Filter nd Each methods are similar
// Get first node of all children from slideshow node
console.log($('slideshow').children().first().html())
// Get last node of all children from slideshow node
console.log($('slideshow').children().last().html())
// Get slide node under slideshow node, matching on first index
console.log($('slideshow').find('slide').eq(1).html())
// Get slide node tagName, based on index
console.log($('slideshow').find('slide').get(1).tagName)
// Append xml to slideshow node
$('slideshow').append('<slide type="blah"><title>Wait I am a new slide!</title></slide>')
// Prepend xml to slideshow node
$('slideshow').prepend('<slide type="blah"><title>Wait I am a new slide!</title></slide>')
// Add xml after matching slide node
$('slideshow').find('slide[type="second"]').after('<slide type="blah"><title>Wait I am a new slide!</title></slide>')
@rproman
Copy link

rproman commented Jan 29, 2022

Thank you for sharing this.

@odevodyssey
Copy link
Author

odevodyssey commented Feb 10, 2022

You're welcome @rproman!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment