Add skooma-like functional DOM rendering helper
This commit is contained in:
commit
cf4455ca7a
1 changed files with 26 additions and 0 deletions
26
render.js
Normal file
26
render.js
Normal file
|
@ -0,0 +1,26 @@
|
||||||
|
const parseArgs = (element, args) => {
|
||||||
|
for (arg of args)
|
||||||
|
if (typeof(arg) == "string")
|
||||||
|
element.appendChild(document.createTextNode(arg))
|
||||||
|
else if ("nodeName" in arg)
|
||||||
|
element.appendChild(arg)
|
||||||
|
else if ("length" in arg)
|
||||||
|
parseArgs(element, arg)
|
||||||
|
else
|
||||||
|
for (key in arg)
|
||||||
|
element.setAttribute(key, arg[key])
|
||||||
|
}
|
||||||
|
|
||||||
|
export const node = (name, args) => {
|
||||||
|
const element = document.createElement(name)
|
||||||
|
parseArgs(element, args)
|
||||||
|
return element
|
||||||
|
}
|
||||||
|
|
||||||
|
export const html = new Proxy(Window, { get: (target, prop, receiver) => {
|
||||||
|
// This distinction is only helpful because javascript is fucking restarted
|
||||||
|
if (prop.search(/^[A-Z]/)+1)
|
||||||
|
return (arg) => node(prop, [arg])
|
||||||
|
else
|
||||||
|
return (...args) => node(prop, args)
|
||||||
|
}})
|
Loading…
Reference in a new issue