creates HTML from jade like expressions
Particularly useful if you are a fan of insertAdjacentHTML but if setting innerHTML is your
thing el works just as well.
Install with npm:
$ npm install el-component
tag- can be the name of HTML tag (span,imgetc.) or a jade-like expressioncontent- is an optional content of the tagattributes- object with a map of attributes added to the generated HTML, class attribute is merged with what was parsed from tag
Some examples:
el('span', 'some text inside'); // <span>some text inside</span>
el('span.title', 'Title'); // <span class="title">Title</span>
el('span.title.car', 'Title'); // <span class="title car">Title</span>
el('span#title.car', 'Title'); // <span class="car" id="title">Title</span>
you can skip the tag name if you want div:
el('#title', 'Title'); // <div id="title">Title</div>
el(); // <div></div>
el knows about void elements:
el('img', { src: 'http://example.com/img.png' }); // <img src="http://example.com/img.png">
el('iframe', { src: 'http://example.com' }); // <iframe src="http://example.com"></iframe>
A version of el that can be used to render XML (SVG etc.). It has no notion of voids, which means it closes tags without content with />.
Some examples:
el.xml('path', { d: 'M0 0H5V7Z' }); // <path d="M0 0H5V7Z"/>
MIT