利用者:Ef3/Vanilla JS
< 利用者:Ef3
function Elm(name, attributes = {}, children = []) {
let elm = document.createElement(name);
Object.assign(elm, attributes);
children.forEach(child => elm.appendChild(child));
return elm;
}
function Text(nodeValue) {
return document.createTextNode(nodeValue);
}
const message = "Hello Vanilla JS",
input = Elm("input", {
"value": message
}),
text = Text(message),
view = Elm("div", {
"class": "block"
}, [
input,
Elm("p", {}, [text])
]),
handller = e => text.nodeValue = input.value;
input.addEventListener("keyup", handller);
input.addEventListener("keydown", handller);
document.body.appendChild(view);