1
- # html-react-parser [ ![ Build Status] ( https://travis-ci.org/remarkablemark/html-react-parser.svg?branch=master )] ( https://travis-ci.org/remarkablemark/html-react-parser ) [ ![ Coverage Status] ( https://coveralls.io/repos/github/remarkablemark/html-react-parser/badge.svg?branch=master )] ( https://coveralls.io/github/remarkablemark/html-react-parser?branch=master )
1
+ # html-react-parser
2
+
3
+ [ ![ NPM] ( https://nodei.co/npm/html-react-parser.png )] ( https://nodei.co/npm/html-react-parser/ )
4
+
5
+ [ ![ NPM version] ( https://img.shields.io/npm/v/html-react-parser.svg )] ( https://www.npmjs.com/package/html-react-parser )
6
+ [ ![ Build Status] ( https://travis-ci.org/remarkablemark/html-react-parser.svg?branch=master )] ( https://travis-ci.org/remarkablemark/html-react-parser )
7
+ [ ![ Coverage Status] ( https://coveralls.io/repos/github/remarkablemark/html-react-parser/badge.svg?branch=master )] ( https://coveralls.io/github/remarkablemark/html-react-parser?branch=master )
8
+ [ ![ Dependency status] ( https://david-dm.org/remarkablemark/html-react-parser.svg )] ( https://david-dm.org/remarkablemark/html-react-parser )
2
9
3
10
An HTML to React parser.
4
11
@@ -15,7 +22,7 @@ var Parser = require('html-react-parser');
15
22
var reactElement = (
16
23
Parser (' <p>Hello, world!</p>' ) // equivalent to `React.createElement('p', {}, 'Hello, world!')`
17
24
);
18
- ReactDOM .render (reactElement, document .getElementById (' node ' ));
25
+ require ( ' react-dom ' ) .render (reactElement, document .getElementById (' root ' ));
19
26
```
20
27
21
28
## Installation
@@ -49,7 +56,7 @@ ReactDOM.render(
49
56
// nested elements
50
57
ReactDOM .render (
51
58
Parser (' <ul><li>inside</li></ul>' ),
52
- document .getElementedById (' root' )
59
+ document .getElementById (' root' )
53
60
);
54
61
55
62
// attributes are preserved
@@ -65,7 +72,7 @@ ReactDOM.render(
65
72
66
73
` replace ` allows you to swap an element with your own React element.
67
74
68
- The output of ` domNode ` is the same as the output from [ htmlparser2.parseDOM] ( https://github.com/fb55/domhandler#example ) .
75
+ The ` domNode ` object has the same schema as the output from [ htmlparser2.parseDOM] ( https://github.com/fb55/domhandler#example ) .
69
76
70
77
``` js
71
78
var Parser = require (' html-react-parser' );
@@ -90,8 +97,7 @@ var reactElement = Parser(html, {
90
97
}
91
98
});
92
99
93
- var ReactDOM = require (' react-dom' );
94
- ReactDOM .render (reactElement, document .getElementById (' root' ));
100
+ require (' react-dom' ).render (reactElement, document .getElementById (' root' ));
95
101
// <div><span style="font-size: 42px;">replaced!</span></div>
96
102
```
97
103
0 commit comments