zoukankan      html  css  js  c++  java
  • Jsrender初体验

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

    前端页面中看到了一段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);

         

  • 相关阅读:
    2019省赛训练组队赛4.9周二 2017浙江省赛
    #Leetcode# 49. Group Anagrams
    #Leetcode# 57. Insert Interval
    POJ 2195 Going Home
    HDU 2255 奔小康赚大钱
    HDU 1083 Courses
    HDU 2063 过山车
    POJ 3041 Asteroids
    指针的妙处
    jzoj 6273. 2019.8.4【NOIP提高组A】欠钱 (money)
  • 原文地址:https://www.cnblogs.com/jingsha/p/5884852.html
Copyright © 2011-2022 走看看