Get started with blueimp-JavaScript-Templates CDN

MIT licensed

Blueimp: Lightweight JS library for rendering HTML templates with data.

Tags:
  • javascript
  • templates
  • templating

Stable version

Copied!

How to start using blueimp-JavaScript-Templates CDN


<!DOCTYPE html>
<html>
<head>
    <title>Get started with blueimp-JavaScript-Templates CDN - cdnhub.io</title>
    <script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
    <script src="https://cdn.cdnhub.io/blueimp-JavaScript-Templates/3.20.0/js/tmpl.min.js"></script>
    <script>
        $(document).ready(function() {
            var data = [
                { name: "John Doe", age: 25 },
                { name: "Jane Doe", age: 30 },
                { name: "Bob Smith", age: 45 }
            ];

            var template = $('<script type="text/x-handlebars-template">'+
                '<ul>'+
                    '<li {{#each this}}>'+
                        '<span>Name: {{name}}</span>'+
                        '<span>Age: {{age}}</span>'+
                    '</li>'+
                '</ul>'+
                '</script>').appendTo('body').remove();

            var compiledTemplate = Handlebars.compile(template.html());
            $('body').append(compiledTemplate(data));
        });
    </script>
</head>
<body>
</body>
</html>
Copied!
Copied!
Copied!

All versions