npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

node-html-parser-hyperscript

v5.4.3

Published

A very fast HTML parser, generating a simplified DOM, with basic element query support.

Downloads

11

Readme

Forked only to changes regex that parses attributes to allow the _ attribute key used by Hyperscript. Also allowing for attribute values with line breaks.

Fast HTML Parser NPM version Build Status

Fast HTML Parser is a very fast HTML parser. Which will generate a simplified DOM tree, with element query support.

Per the design, it intends to parse massive HTML files in lowest price, thus the performance is the top priority. For this reason, some malformatted HTML may not be able to parse correctly, but most usual errors are covered (eg. HTML4 style no closing <li>, <td> etc).

Install

npm install --save node-html-parser

Note: when using Fast HTML Parser in a Typescript project the minimum Typescript version supported is ^4.1.2.

Performance

html-parser     :24.2329 ms/file ± 18.8092
htmljs-parser   :4.78952 ms/file ± 5.50403
html-dom-parser :2.19594 ms/file ± 3.07470
html5parser     :1.72007 ms/file ± 2.22713
cheerio         :12.2220 ms/file ± 8.14063
parse5          :6.77691 ms/file ± 4.12002
htmlparser2     :2.33526 ms/file ± 3.43847
htmlparser      :17.6260 ms/file ± 122.314
high5           :3.85676 ms/file ± 2.48878
node-html-parser:2.04585 ms/file ± 1.23787
node-html-parser (last release):2.00236 ms/file ± 1.22263

Tested with htmlparser-benchmark.

Usage

import { parse } from 'node-html-parser';

const root = parse('<ul id="list"><li>Hello World</li></ul>');

console.log(root.firstChild.structure);
// ul#list
//   li
//     #text

console.log(root.querySelector('#list'));
// { tagName: 'ul',
//   rawAttrs: 'id="list"',
//   childNodes:
//    [ { tagName: 'li',
//        rawAttrs: '',
//        childNodes: [Object],
//        classNames: [] } ],
//   id: 'list',
//   classNames: [] }
console.log(root.toString());
// <ul id="list"><li>Hello World</li></ul>
root.set_content('<li>Hello World</li>');
root.toString(); // <li>Hello World</li>
var HTMLParser = require('node-html-parser');

var root = HTMLParser.parse('<ul id="list"><li>Hello World</li></ul>');

Global Methods

parse(data[, options])

Parse the data provided, and return the root of the generated DOM.

  • data, data to parse

  • options, parse options

    {
      lowerCaseTagName: false,  // convert tag name to lower case (hurts performance heavily)
      comment: false,            // retrieve comments (hurts performance slightly)
      blockTextElements: {
        script: true,	// keep text content when parsing
        noscript: true,	// keep text content when parsing
        style: true,		// keep text content when parsing
        pre: true			// keep text content when parsing
      }
    }

valid(data[, options])

Parse the data provided, return true if the given data is valid, and return false if not.

HTMLElement Methods

HTMLElement#trimRight()

Trim element from right (in block) after seeing pattern in a TextNode.

HTMLElement#removeWhitespace()

Remove whitespaces in this sub tree.

HTMLElement#querySelectorAll(selector)

Query CSS selector to find matching nodes.

Note: Full range of CSS3 selectors supported since v3.0.0.

HTMLElement#querySelector(selector)

Query CSS Selector to find matching node.

HTMLElement#getElementsByTagName(tagName)

Get all elements with the specified tagName.

Note: Use * for all elements.

HTMLElement#closest(selector)

Query closest element by css selector.

HTMLElement#appendChild(node)

Append a child node to childNodes

HTMLElement#insertAdjacentHTML(where, html)

Parses the specified text as HTML and inserts the resulting nodes into the DOM tree at a specified position.

HTMLElement#setAttribute(key: string, value: string)

Set value to key attribute.

HTMLElement#setAttributes(attrs: Record<string, string>)

Set attributes of the element.

HTMLElement#removeAttribute(key: string)

Remove key attribute.

HTMLElement#getAttribute(key: string)

Get key attribute.

HTMLElement#exchangeChild(oldNode: Node, newNode: Node)

Exchanges given child with new child.

HTMLElement#removeChild(node: Node)

Remove child node.

HTMLElement#toString()

Same as outerHTML

HTMLElement#set_content(content: string | Node | Node[])

Set content. Notice: Do not set content of the root node.

HTMLElement#remove()

Remove current element.

HTMLElement#replaceWith(...nodes: (string | Node)[])

Replace current element with other node(s).

HTMLElement#classList

HTMLElement#classList.add

Add class name.

HTMLElement#classList.replace(old: string, new: string)

Replace class name with another one.

HTMLElement#classList.remove()

Remove class name.

HTMLElement#classList.toggle(className: string):void

Toggle class. Remove it if it is already included, otherwise add.

HTMLElement#classList.contains(className: string): boolean

Returns true if the classname is already in the classList.

HTMLElement#classList.values()

Get class names.

Node#clone()

Clone a node.

Node#getElementById(id: string): HTMLElement;

Get element by it's ID.

HTMLElement Properties

HTMLElement#text

Get unescaped text value of current node and its children. Like innerText. (slow for the first time)

HTMLElement#rawText

Get escaped (as-is) text value of current node and its children. May have &amp; in it. (fast)

HTMLElement#tagName

Get or Set tag name of HTMLElement. Notice: the returned value would be an uppercase string.

HTMLElement#structuredText

Get structured Text.

HTMLElement#structure

Get DOM structure.

HTMLElement#firstChild

Get first child node.

HTMLElement#lastChild

Get last child node.

HTMLElement#innerHTML

Set or Get innerHTML.

HTMLElement#outerHTML

Get outerHTML.

HTMLElement#nextSibling

Returns a reference to the next child node of the current element's parent.

HTMLElement#nextElementSibling

Returns a reference to the next child element of the current element's parent.

HTMLElement#previousSibling

Returns a reference to the previous child node of the current element's parent.

HTMLElement#previousElementSibling

Returns a reference to the previous child element of the current element's parent.

HTMLElement#textContent

Get or Set textContent of current element, more efficient than set_content.

HTMLElement#attributes

Get all attributes of current element. Notice: do not try to change the returned value.

HTMLElement#classList

Get all attributes of current element. Notice: do not try to change the returned value.

HTMLElement#range

Corresponding source code start and end indexes (ie [ 0, 40 ])