您的位置:首页 > Web前端 > JavaScript

Jsrender初体验

2016-09-19 19:33 288 查看
  支持一个活动,在以往项目基础上修修改改,通过这类小微项目快速熟悉开发、测试以及部署环境。

前端页面中看到了一段Js代码,从语法结构上看有点像模板引擎,最后确认是一个基于jquery的模板引擎-JsRender.官网

  特定的js标签,通过API可以很方便生成html代码,ajax获取后端json数据后渲染为html代码,然后显示到容器中,简洁易用的API,今后的项目开发多了一个选择。

JsRender提供了常用的流程控制,非常方便,项目中主要用到了一个循环生成产品列表,后续根据实际情况再慢慢熟悉。

<script type="text/x-jsrender" id="scriptProductList">
{{for ProductList}}
<div class="product">
<a target="_blank" href="{{>productURL}}" class="pro-name" title="{{>productName}}">{{>productName}}</a>
<a target="_blank" href="{{>companyURL}}" class="pro-com" title="{{>companyName}}">{{>companyName}}</a>
</div>
{{/for}}
</script>


var html = $("#scriptProductList").render({ "ProductList":data.results });
$("#divRender").html(html);
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: