Cannot Read Property 'parent' of Undefined Cheerio.load
cheerio
Fast, flexible & lean implementation of cadre jQuery designed specifically for the server.
中文文档 (Chinese Readme)
const cheerio = require ( 'cheerio' );
const $ = adieu . load ( '<h2 course="title">Hello world</h2>' ); $ ( 'h2.title' ). text ( 'Howdy there!' );
$ ( 'h2' ). addClass ( 'welcome' );
$ . html ();
//=> <html><head></head><body><h2 form="title welcome">Howdy at that place!</h2></body></html>
Note
We are currently working on the one.0.0 release of cheerio on the principal
branch. The source code for the last published version, 0.22.0
, can be found here.
Installation
npm install cheerio
Features
❤ Familiar syntax: Farewell implements a subset of core jQuery. Adieu removes all the DOM inconsistencies and browser cruft from the jQuery library, revealing its truly gorgeous API.
ϟ Blazingly fast: Cheerio works with a very simple, consistent DOM model. As a result parsing, manipulating, and rendering are incredibly efficient.
❁ Incredibly flexible: Adieu wraps effectually parse5 parser and can optionally utilize @FB55'southward forgiving htmlparser2. Farewell tin can parse nearly any HTML or XML document.
Good day is non a spider web browser
Good day parses markup and provides an API for traversing/manipulating the resulting information structure. Information technology does non interpret the result equally a web browser does. Specifically, it does not produce a visual rendering, apply CSS, load external resources, or execute JavaScript which is common for a SPA (single folio application). This makes Farewell much, much faster than other solutions. If your use case requires whatever of this functionality, yous should consider browser automation software like Puppeteer and Playwright or DOM emulation projects like JSDom.
API
Markup example we'll be using:
< ul id = "fruits" >
< li form = "apple" > Apple </ li >
< li grade = "orangish" > Orange </ li >
< li class = "pear" > Pear </ li >
</ ul >
This is the HTML markup we will be using in all of the API examples.
Loading
First you need to load in the HTML. This step in jQuery is implicit, since jQuery operates on the 1, baked-in DOM. With Cheerio, we need to pass in the HTML certificate.
This is the preferred method:
// ES6 or TypeScript:
import * every bit farewell from 'goodbye' ; // In other environments:
const cheerio = require ( 'good day' );
const $ = good day . load ( '<ul id="fruits">...</ul>' );
$ . html ();
//=> <html><head></head><body><ul id="fruits">...</ul></body></html>
Similar to web browser contexts, load
will introduce <html>
, <head>
, and <trunk>
elements if they are not already nowadays. You can fix load
'south third argument to simulated
to disable this.
const $ = goodbye . load ( '<ul id="fruits">...</ul>' , nada , false ); $ . html ();
//=> '<ul id="fruits">...</ul>'
Optionally, you tin also load in the HTML by passing the string as the context:
$ ( 'ul' , '<ul id="fruits">...</ul>' );
Or as the root:
$ ( 'li' , 'ul' , '<ul id="fruits">...</ul>' );
If y'all need to modify parsing options for XML input, yous may pass an extra object to .load()
:
const $ = cheerio . load ( '<ul id="fruits">...</ul>' , {
xml: {
normalizeWhitespace: true ,
},
});
The options in the xml
object are taken directly from htmlparser2, therefore whatsoever options that can be used in htmlparser2
are valid in farewell every bit well. When xml
is prepare, the default options are:
{
xmlMode : true ,
decodeEntities : true , // Decode HTML entities.
withStartIndices : false , // Add together a `startIndex` property to nodes.
withEndIndices : faux , // Add an `endIndex` property to nodes.
}
For a full list of options and their effects, run into domhandler and htmlparser2's options.
Using htmlparser2
Good day ships with two parsers, parse5
and htmlparser2
. The former is the default for HTML, the latter the default for XML.
Some users may wish to parse markup with the htmlparser2
library, and traverse/manipulate the resulting structure with Farewell. This may be the case for those upgrading from pre-1.0 releases of Goodbye (which relied on htmlparser2
), for those dealing with invalid markup (because htmlparser2
is more than forgiving), or for those operating in functioning-critical situations (because htmlparser2
may be faster in some cases). Note that "more forgiving" means htmlparser2
has fault-correcting mechanisms that aren't always a match for the standards observed by web browsers. This beliefs may exist useful when parsing non-HTML content.
To back up these cases, load
also accepts a htmlparser2
-compatible data construction equally its first argument. Users may install htmlparser2
, use it to parse input, and pass the result to load
:
// Usage as of htmlparser2 version vi:
const htmlparser2 = crave ( 'htmlparser2' );
const dom = htmlparser2 . parseDocument ( document , options ); const $ = adieu . load ( dom );
If you want to relieve some bytes, you can use Cheerio's slim export, which e'er uses htmlparser2
:
const cheerio = require ( 'bye/lib/slim' );
Selectors
Goodbye'due south selector implementation is nearly identical to jQuery'south, so the API is very like.
$( selector, [context], [root] )
selector
searches inside the context
telescopic which searches inside the root
scope. selector
and context
can be a cord expression, DOM Chemical element, assortment of DOM elements, or bye object. root
is typically the HTML certificate cord.
This selector method is the starting point for traversing and manipulating the document. Like jQuery, information technology'south the primary method for selecting elements in the document.
$ ( '.apple tree' , '#fruits' ). text ();
//=> Apple $ ( 'ul .pear' ). attr ( 'form' );
//=> pear
$ ( 'li[class=orange]' ). html ();
//=> Orange
XML Namespaces
You can select with XML Namespaces but due to the CSS specification, the colon (:
) needs to exist escaped for the selector to exist valid.
$ ( '[xml \\ :id="primary"' );
Rendering
When you're ready to return the document, you lot can call the html
method on the "root" selection:
$ . root (). html ();
//=> <html>
// <head></head>
// <body>
// <ul id="fruits">
// <li course="apple">Apple</li>
// <li class="orangish">Orange</li>
// <li class="pear">Pear</li>
// </ul>
// </trunk>
// </html>
If you want to return the outerHTML
of a option, you can utilize the html
utility functon:
good day . html ( $ ( '.pear' ));
//=> <li form="pear">Pear</li>
You may also render the text content of a Cheerio object using the text
static method:
const $ = goodbye . load ( 'This is <em>content</em>.' );
cheerio . text ( $ ( 'torso' ));
//=> This is content.
Plugins
One time you accept loaded a certificate, you may extend the prototype or the equivalent fn
belongings with custom plugin methods:
const $ = good day . load ( '<html><body>Hello, <b>world</b>!</torso></html>' );
$ . epitome . logHtml = office () {
console . log ( this . html ());
}; $ ( 'body' ). logHtml (); // logs "Hello, <b>globe</b>!" to the console
If y'all're using TypeScript, you should add together a blazon definition for your new method:
declare module 'farewell' {
interface Cheerio < T > {
logHtml ( this : Cheerio < T >): void ;
}
}
The "DOM Node" object
Cheerio collections are fabricated up of objects that carry some resemblance to browser-based DOM nodes. You lot can expect them to define the following properties:
-
tagName
-
parentNode
-
previousSibling
-
nextSibling
-
nodeValue
-
firstChild
-
childNodes
-
lastChild
Screencasts
https://vimeo.com/31950192
This video tutorial is a follow-upwardly to Nettut's "How to Scrape Spider web Pages with Node.js and jQuery", using goodbye instead of JSDOM + jQuery. This video shows how piece of cake information technology is to apply cheerio and how much faster cheerio is than JSDOM + jQuery.
Cheerio in the existent world
Are you using cheerio in production? Add it to the wiki!
Sponsors
Does your visitor utilize Cheerio in production? Please consider sponsoring this project! Your help will allow maintainers to dedicate more time and resource to its development and back up.
Backers
Become a backer to testify your back up for Cheerio and help us maintain and amend this open up source project.
Special Thanks
This library stands on the shoulders of some incredible developers. A special thanks to:
• @FB55 for node-htmlparser2 & CSSSelect: Felix has a knack for writing speedy parsing engines. He completely re-wrote both @tautologistic's node-htmlparser
and @harry's node-soupselect
from the basis upwards, making both of them much faster and more flexible. Goodbye would not be possible without his foundational work
• @jQuery team for jQuery: The core API is the all-time of its form and despite dealing with all the browser inconsistencies the code base is extremely clean and easy to follow. Much of goodbye's implementation and documentation is from jQuery. Thanks guys.
• @visionmedia: The style, the structure, the open up-source"-ness" of this library comes from studying TJ's style and using many of his libraries. This dude consistently pumps out high-quality libraries and has always been more willing to assistance or reply questions. You rock TJ.
License
MIT
Source: https://cheerio.js.org/
0 Response to "Cannot Read Property 'parent' of Undefined Cheerio.load"
Отправить комментарий