<div class="entry">
<h1>{{title}}</h1>
<div class="body">
{{body}}
</div>
</div>
template('*', {
title: 'Lorem ipsum dolor sit amet.',
body: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eos, optio.'
});
function template(selector, data) {
[].forEach.call(document.querySelectorAll(selector), function(node) {
node.innerHTML = tag(node.innerHTML, data);
});
}
function tag(input, data) {
for (var key in data) {
input = input.replace(new RegExp('{{'+ key +'}}', 'g'), data[key]);
}
return input;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.