let dom = new Proxy({}, {
get(target, key) {
return function (attrs = {}, ...children) {
let el = document.createElement(key)
for (let attr of Object.keys(attrs)) {
el.setAttribute(attr, attrs[attr])
}
for (let child of children) {
if (typeof child === 'string') {
child = document.createTextNode(child)
}
el.appendChild(child)
}
return el
}
}
})
let rec = dom.div({ id: 'demo' },
'Hello World',
dom.a({ href: '#' }, 'link'),
dom.ul({ id: 'list' },
dom.li({}, 'item1'),
dom.li({}, 'item2')
)
)
document.querySelector('#app').appendChild(rec)
console