html-dom-parser

HTML to DOM parser that works on both the server (Node.js) and the client (browser):

HTMLDOMParser(string[, options])

It converts an HTML string to a JavaScript object that describes the DOM tree.

Example:

var parse = require('html-dom-parser');
parse('<div>text</div>');

Output:

[ { type: 'tag',
    name: 'div',
    attribs: {},
    children:
     [ { data: 'text',
         type: 'text',
         next: null,
         prev: null,
         parent: [Circular] } ],
    next: null,
    prev: null,
    parent: null } ]

Repl.it | JSFiddle | Examples

Installation

NPM:

$ npm install html-dom-parser --save

Yarn:

$ yarn add html-dom-parser

CDN:

<script src="https://unpkg.com/html-dom-parser@latest/dist/html-dom-parser.js"></script>
<script>
  window.HTMLDOMParser(/* string */);
</script>

Usage

Import the module:

// CommonJS
var parse = require('html-dom-parser');

// ES Modules
import parse from 'html-dom-parser';

Parse markup:

parse('<p class="primary" style="color: skyblue;">Hello world</p>');

Output:

[ { type: 'tag',
    name: 'p',
    attribs: { class: 'primary', style: 'color: skyblue;' },
    children:
     [ { data: 'Hello world',
         type: 'text',
         next: null,
         prev: null,
         parent: [Circular] } ],
    next: null,
    prev: null,
    parent: null } ]

The server parser is a wrapper of htmlparser2's parseDOM; the client parser mimics the server parser by using the DOM API.

Testing

Run server and client tests:

$ npm test

Run server tests with coverage:

$ npm run test:server:coverage

# generate html report
$ npm run test:server:coverage:report

Run client tests:

$ npm run test:client

Lint files:

$ npm run lint

# fix lint errors
$ npm run lint:fix

Test TypeScript declaration file for style and correctness:

$ npm run dtslint

Release

Only collaborators with credentials can release and publish:

$ npm run release
$ git push --follow-tags && npm publish

Special Thanks

License

MIT

NrqhEIcsRi004/html-dom-parser