Document address: https://aui.github.io/art-template/docs/index.html

gitHub address:
https://github.com/aui/art-template

Examples of usage are in github's example.

In general, you need to spell N multiple tr and td manually when you query the data list without using the template engine Ajax.
For example:

$.get("${ctx}/student/list",function(r) {
    if (r.returncode == 0) {
      if (r.data) {
        var t = $('#list tbody').empty();
        for (var i=0;i< r.data.length;i++) {
          var item = r.data[i];
          var tr = "<tr><td>"+ (i+1)+"</td><td>" + item.name + "</td><td>" + item.age + "</td><td>" + item.scoreSum+ "</td><td>"+ item.scoreAvg + "<td></tr>";
          t.append($(tr));
        }
      }
    }
    else {
      layer.alert(r.errmsg);
    }
});

After using JS template:

<script type="text/javascript" src="${ctx}/asset/js/art-template/template-web.js"></script>
<script id="template" type="text/html">
    {{each data item index}}
    <tr>
        <td>{{index+1}}</td>
        <td>{{item['name']}}</td>
        <td>{{item['age']}}</td>
        <td>{{item['score_sum']}}</td>
        <td>{{item['score_avg']}}</td>
    </tr>
    {{/each}}
</script>
// Get template content string
var templateHtml = $('#template').html();
// Compilation template
var render = template.compile(templateHtml);
$('#queryAll').click(function () {
    $.get("${ctx}/student/list", function (r) {
        if (r.returncode == 0) {
            if (r.data) {
                // Render template
                var html = render(r);
                $('#list tbody').html(html);
            }
        }
        else {
            layer.alert(r.errmsg);
        }
    });
});