var make = (function() { if (typeof Array.isArray !== 'function') { Array.isArray = function(a) { return Object.prototype.toString.call(a) === "[object Array]"; }; } function make(desc) { if (!Array.isArray(desc)) { return make.call(this, Array.prototype.slice.call(arguments)); } var name = desc[0]; name = splitTag(name); var attrs = name[1]; name = name[0]; var attributes = desc[1]; var el = document.createElement(name); var start = 1; if (typeof attributes === "object" && attributes !== null && !Array.isArray(attributes)) { mergeAttributes(attrs, attributes); start = 2; } attributes = attrs; for (var attr in attributes) { if (typeof attributes[attr] === 'string') { console.log(attr, attributes[attr]); el.setAttribute(attr, attributes[attr]); } else { el[attr] = attributes[attr]; } } for (var i = start; i < desc.length; i++) { if (Array.isArray(desc[i])) { el.appendChild(make(desc[i])); } else if (desc[i] instanceof Element) { el.appendChild(desc[i]); } else { el.appendChild(document.createTextNode(desc[i])); } } return el; } function mergeAttributes(attr1, attr2) { for (var key in attr2) { if (!attr1.hasOwnProperty(key)) { attr1[key] = attr2[key]; } else if (key === "class") { attr1[key] += " " + attr2[key]; } } } function splitTag(tag) { var attr = {}; var c = tag.split("."); var t = c[0].split("#"); if (t[1]) attr.id = t[1]; if (c.length > 1) attr["class"] = c.slice(1).join(" "); return [t[0] || "div", attr]; } return make; })();