Underscore template

/*********************************************************************
 *                     Underscore template
 * 说明：
 *     在找JavaScript数据处理lib的时候，找到Underscore，细读一下其开发文档，
 * 发现里面有template处理，对比了一下Handlebars，感觉Underscore更适合目前使
 * 用，主要是目前足够了。
 *
 *                                   2017-8-28 深圳 龙华樟坑村 曾剑锋
 ********************************************************************/

一、参考文档：
    . Underscore
        http://underscorejs.org/
    . Underscore template
        http://www.bootcss.com/p/underscore/#template
    . UnderscoreJS精巧而强大工具包
        http://blog.fens.me/nodejs-underscore/
    . underscore templates - JSFiddle
        https://jsfiddle.net/casiano/LS384/

二、template demo：
    <!-- Install jQuery and underscore -->

    <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="http://documentcloud.github.com/underscore/underscore-min.js"></script>

    <!-- Create your template -->
    <script type="foo/bar" id='usageList'>
    <table cellspacing='' cellpadding='' border='' >
        <thead>
          <tr>
            <th>Id</th>
            <th>Name</th>
          </tr>
        </thead>
        <tbody>
          <%
            // repeat items
            _.each(items,function(item,key,list){
              // create variables
              var f = item.name.split("").shift().toLowerCase();
          %>
            <tr>
              <!-- use variables -->
              <td><%= key %></td>
              <td class="<%= f %>">
                <!-- use %- to inject un-sanitized user input (see 'Demo of XSS hack') -->
                <h3><%- item.name %></h3>
                <p><%- item.interests %></p>
              </td>
            </tr>
          <%
            });
          %>
        </tbody>
      </table>
    </script>

    <!-- Create your target -->

    <div id="target"></div>

    <!-- Write some code to fetch the data and apply template -->

    <script type="text/javascript">
      var items = [
        {name:"Alexander", interests:"creating large empires"},
        {name:"Edward", interests:"ha.ckers.org <\nBGSOUND SRC=\"javascript:alert('XSS');\">"},
        {name:"..."},
        {name:"Yolando", interests:"working out"},
        {name:"Zachary", interests:"picking flowers for Angela"}
      ];
      var template = $("#usageList").html();
      $("#target").html(_.template(template,{items:items}));
    </script>