Skip to content

Instantly share code, notes, and snippets.

@brettz9
Last active January 11, 2020 02:37
Show Gist options
  • Save brettz9/ac4c18f51c0af8003a41 to your computer and use it in GitHub Desktop.
Save brettz9/ac4c18f51c0af8003a41 to your computer and use it in GitHub Desktop.
Jamilih Lite (see also https://github.com/brettz9/jamilih ); for adaptation and inclusion in stand-alone libraries which still wish to build the DOM in an attractive, pure JS, and syntax-highlighting/JS-friendly manner. For the string-building equivalent, see https://gist.github.com/brettz9/72bb6a460212d9350f67
function jml (elName, atts, children) {'use strict';
var el = typeof elName === 'string' ? document.createElement(elName) : elName;
if (atts && Array.isArray(atts)) {
children = atts;
}
else if (atts) {
Object.keys(atts).forEach(function (att) {
var attVal = atts[att];
if (att === '$on') {
return Object.keys(attVal).forEach(function (ev) {
var val = attVal[ev];
val = (typeof val === 'function') ? [val, false] : val;
el.addEventListener(ev, val[0], val[1]);
});
}
if (typeof attVal === 'object') { // e.g., with att as 'dataset' or 'style' (use cssFloat in place of float on style)
return Object.keys(attVal).forEach(function (prop) {
el[att][prop.replace(/-([a-z])/g, function (n0, n1) {
return n1.toUpperCase();
})] = attVal[prop];
});
}
el.setAttribute(att, attVal);
});
}
(children || []).forEach(function (child) {
if (['string', 'number', 'boolean'].indexOf(typeof child) > -1) {
el.appendChild(document.createTextNode(child));
}
else {
el.appendChild(jml.apply(null, child));
}
});
return el;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment