关于 underscore 中模板引擎的应用示例

最新推荐文章于 2021-09-09 14:52:18 发布

大事龙

最新推荐文章于 2021-09-09 14:52:18 发布

阅读量2.4k

点赞数 1

分类专栏： JS

本文链接：https://blog.csdn.net/w_yunlong/article/details/50425536

版权

JS 专栏收录该内容

21 篇文章 1 订阅

订阅专栏

                    
  //关于 underscore 中模板引擎的应用示例 <!doctype html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <title>关于 underscore 中模板引擎的应用示例</title> </head> <body> <ul id="test"></ul> <script type="text/template" id="tpl"> <% for(var i = 0; i < list.length; i++) { %> <% var item = list[i] %> <li> <span><%=item.firstName%> <%=item.lastName%></span> <span><%-item.city%></span> </li> <% } %> </script> <script src="sea.js"></script> <script> seajs.config({ paths: { 'baiducdn': 'http://libs.baidu.com', '360cdn': 'http://libs.useso.com/', 'freecdn': 'http://libs.cncdn.cn/', 'sinacdn': 'http://lib.sinaapp.com/', }, alias: { 'jquery': 'baiducdn/jquery/2.0.3/jquery.min.js', 'backbone': 'baiducdn/backbone/0.9.2/backbone-min.js', 'underscore': 'baiducdn/underscore/1.3.3/underscore-min.js', }, }); seajs.use(['jquery', 'underscore'], function(){ var testObj = $('#test'), tpl = $('#tpl').html(); //准备数据，可以通过JSON来自服务器 var data = { list: [ {firstName: 'Li', lastName: 'Yunlong', city: '济南'}, {firstName: 'Wang', lastName: 'Yunlong', city: '北京'}, ] }; var html = _.template(tpl, data);//解析模板 testObj.html(html); }); </script> </body> </html>

大事龙

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
关于 underscore 中模板引擎的应用示例

//关于 underscore 中模板引擎的应用示例<!doctype html><html><head><meta charset="utf-8"><meta name="viewport" content="width=d
复制链接

扫一扫