hyperhype / hyperscript

Create HyperText with JavaScript.
MIT License
2.64k stars 110 forks source link

What if tag contains text mixed with formatting nodes? #58

Open jayarjo opened 7 years ago

jayarjo commented 7 years ago

Consider html like this:

<p>
     Some text here with <strong>parts</strong> and some 
     <span style="color: purple;">inline styling</span>.
</p>

How do we convert this to HyperScript?

dominictarr commented 7 years ago

those values would be escaped - they'd appear in the text as <strong> not as tags. If you trust the string, then you can do h('div', {innerHTML: string}) but if it's a user provided string, that will be a security hole.

in that case, you just need to find an html escaping module, than can allow certain tags and not others.

fadookie commented 6 years ago

innerHTML seems to work great for parsing an HTML string into a hyperscript object at runtime.

But for posterity I wanted to show an example of how to translate the above HTML snippet into hyperscript code, since you can supply a children array with a mix of strings and hyperscript tags like so:

h('p', [
    'Some text here with ',
     h('strong', 'parts'),
     ' and some',
     //etc.
])