Mustache.js

Mustache.js

by Oski Krawczyk

HTML

<script src="https://github.com/janl/mustache.js/raw/master/mustache.js"></script>
<h1>{{header}}</h1>
{{#bug}}
{{/bug}}

<ul>
{{#items}}
  {{#first}}
    <li><strong>{{name}}</strong></li>
  {{/first}}
  {{#link}}
    <li><a href="{{url}}">{{name}}</a></li>
  {{/link}}
{{/items}}
</ul>

{{#empty}}
  <p>The list is empty.</p>
{{/empty}}

JavaScript

var body = document.getElement('body');
var template = {
  "header": "Colors",
  "items": [
      {"name": "red", "first": true, "url": "#Red"},
      {"name": "green", "link": true, "url": "#Green"},
      {"name": "blue", "link": true, "url": "#Blue"}
  ],
  "empty": false
};

(function(){
    Object.implement('mustache', function(view, partials){
        return Mustache.to_html(view, this, partials);
    });
})();

var html = template.mustache(body.get('html'));

body.set('html', html);