美文网首页
JavaScript---模版引擎

JavaScript---模版引擎

作者: AuglyXu | 来源:发表于2018-11-24 17:11 被阅读0次

    模版引擎

    • 使用步骤:
      • 引入模板引擎
      • 从服务器获取数据
      • 编写模板相关的代码
    • 注意点: 模板相关的代码必须放到获取数据之前
    <body>
    <!--1引入模板引擎-->
    <script src="js/template-web.js"></script>
    <script id="nj" type="text/html">
        <!--
        <%=对象中的key%>
        以上代码的含义: 根据指定的key获取传递过来对象中的数据
        -->
        <h1><%=title%></h1>
        <ul>
            <% for( var i = 0, len = list.length; i < len; i++){ %>
                <li><%=list[i]%></li>
            <% } %>
        </ul>
    </script>
    <script>
        var data = {
            title: "王者荣耀",
            list: ['荆轲', '兰陵王', '孙悟空', '鲁班', '孙尚香', '百日守约']
        };
        var html = template('nj', data);
        document.body.innerHTML = html;
    </script>
    
    </body>
    

    相关文章

      网友评论

          本文标题:JavaScript---模版引擎

          本文链接:https://www.haomeiwen.com/subject/kesyqqtx.html