@@ -122,17 +122,23 @@ The following [example](https://repl.it/@remarkablemark/html-react-parser-replac
122
122
``` jsx
123
123
import React from ' react' ;
124
124
import { renderToStaticMarkup } from ' react-dom/server' ;
125
- import parse , {domToReact } from ' html-react-parser' ;
125
+ import parse , { domToReact } from ' html-react-parser' ;
126
126
127
- const parserOptions = {
127
+ const html = `
128
+ <p id="main">
129
+ <span class="prettify">
130
+ keep me and make me pretty!
131
+ </span>
132
+ </p>
133
+ ` ;
134
+
135
+ const options = {
128
136
replace : ({ attribs, children }) => {
129
137
if (! attribs) return ;
130
138
131
139
if (attribs .id === ' main' ) {
132
140
return (
133
- < h1 style= {{ fontSize: 42 }}>
134
- {domToReact (children, parserOptions)}
135
- < / h1>
141
+ < h1 style= {{ fontSize: 42 }}> {domToReact (children, parserOptions)}< / h1>
136
142
);
137
143
} else if (attribs .class === ' prettify' ) {
138
144
return (
@@ -144,25 +150,17 @@ const parserOptions = {
144
150
}
145
151
};
146
152
147
- const elements = parse (
148
- `
149
- <p id="main">
150
- <span class="prettify">
151
- keep me and make me pretty!
152
- </span>
153
- </p>
154
- ` ,
155
- parserOptions
156
- );
157
-
158
- console .log (renderToStaticMarkup (elements));
153
+ const reactElement = parse (html, options);
154
+ console .log (renderToStaticMarkup (reactElement));
159
155
```
160
156
161
157
The output:
162
158
163
159
``` html
164
160
<h1 style =" font-size :42px " >
165
- <span style =" color :hotpink " >keep me and make me pretty!</span >
161
+ <span style =" color :hotpink " >
162
+ keep me and make me pretty!
163
+ </span >
166
164
</h1 >
167
165
```
168
166
@@ -177,7 +175,7 @@ parse('<p><br id="remove"></p>', {
177
175
178
176
## FAQ
179
177
180
- #### Is the library XSS safe?
178
+ #### Is this library XSS safe?
181
179
182
180
No, this library does ** _ not_ ** sanitize against [ XSS (Cross-Site Scripting)] ( https://wikipedia.org/wiki/Cross-site_scripting ) . See [ #94 ] ( https://github.com/remarkablemark/html-react-parser/issues/94 ) .
183
181
0 commit comments