4 ms·
At my company we prefer using vanilla Javascript over all these (exhausting) frameworks! Especially many of the new features in Ecmascript 6 makes things much s
by olavgg 9y ago
At my company we prefer using vanilla Javascript over all these (exhausting) frameworks! Especially many of the new features in Ecmascript 6 makes things much simpler. No more overusing bind(), template literals for building HTML and so on.
Recently I've missed the way you create DOM elements like you do with React.DOM so I created a simple proxy function like this:
let bai = {};
bai.DOM = function(){
return new Proxy({}, {
get: function(target, name){
return function(args, body) {
let newEle = document.createElement(name);
if(args){
let keys = Object.keys(args);
for (let i = 0; i < keys.length; i++) {
newEle.setAttribute(keys[i], args[keys[i]]);
}
}
if(body){
if(typeof body === 'string'){
newEle.textContent = body;
} else {
newEle.appendChild(body);
}
}
return newEle;
}
}
})
}();
With this you can create new DOM elements as following,
document.body.appendChild(
bai.DOM.div(
{"id": "message"},
bai.DOM.p(null, "hello world")
)
);