[SOLVED] selecting an element by a class name with a dot in it with Cheerio

selecting an element by a class name with a dot in it with Cheerio

I want to extract information out of an HTML document with Cheerio. I cannot alter the content of the HTML file as it has an external origin.

The element I want to extract has a class name with a dot in it:

<span class='prop-data.size'> the content </span>

If I use the class name in Cheerio as a selector, I do not get back the element.

$('.prop-data.size').text() <-- gives null

Is it possible to select an element by a class name with a dot in it in Cheerio?

Can I escape the dot or so?

Solution

Yes, escape the .:

const cheerio = require("cheerio"); // ^1.0.0-rc.12

const html = "<span class='prop-data.size'> the content </span>";

const $ = cheerio.load(html);
console.log($(".prop-data\\.size").text()); // => the content

An attribute selector is also possible: '[class~="prop-data.size"]'.