JSFiddle - React, Tailwind, and code Playground
JavaScript
function domik(element_name, properties, children) {
children = children || [];
var element = document.createElement(element_name);
for (var prop_name in properties) {
if (properties.hasOwnProperty(prop_name)) {
var property = properties[prop_name];
if (typeof property === "function") {
property = "(" + property + ")()";
}
if (property) {
element.setAttribute(prop_name, property);
}
}
}
children.forEach(function (c) {
if (typeof c === "string") {
element.innerHTML += c;
} else {
element.appendChild(c);
}
});
return element;
}
var inpt = domik('input', { id: 'inp_1', type: 'number', value: '0', autofocus: true });
document.body.appendChild(domik('div', { style: 'padding: 100px;' }, [
domik('label', { 'for': 'inp_1' }, [
'Input: '
]),
inpt,
domik('p', { hidden: false }, [
domik('input', { type: 'button', value: 'clickme', onclick: function () { alert('Input is ' + inpt.value); } })
])
]));