@tiddo/set-html-content
v1.0.1
Published
Small wrapper around morphdom to replace the content of a node
Downloads
2
Readme
Small wrapper around morphdom to replace the content of a node
Morphdom allows to efficiently update the state of a DOM element to the state of another DOM element. A common use case for this is to set the content of an element. Setting the content of an element with morphdom requires some extra wrapping though. This module contains all that wrapping.
Usage
The setHtmlContent
function has the same signature as the morphdom
function, the only difference being that setHtmlContent
expects only the content as second argument, without an encapsulating element.
Examples:
String based:
import setHtmlContent from '@tiddo/set-html-content';
const element = document.querySelector('<my-element>');
setHtmlContent(element, '<p>New content</p>');
//element.outerHTML === '<my-element><p>New content</p></my-element>'
DOM based:
import setHtmlContent from '@tiddo/set-html-content';
const element = document.querySelector('<my-element>');
const content = document.createElement('p');
content.textContent = 'New content';
setHtmlContent(element, content);
//element.outerHTML === '<my-element><p>New content</p></my-element>'