artTemplate循环嵌套渲染模板

最新推荐文章于 2022-03-17 12:18:16 发布

appleคิดถึง

最新推荐文章于 2022-03-17 12:18:16 发布

阅读量1.2k

点赞数

分类专栏： js 文章标签： arTemplate 模板嵌套

本文链接：https://blog.csdn.net/weixin_43652106/article/details/93399766

版权

js 专栏收录该内容

11 篇文章 0 订阅

订阅专栏

功能 : 简述artTemplate的简洁用法

一, 下载地址 :

链接: https://pan.baidu.com/s/13dJHROtPC0oGVph1tPqyqQ

提取码: 5nmg

下载artTemplate后，找到template-web.js，引入到页面即可

二, 引入代码:

<script src="/art-template-master/lib/template-web.js"></script>

三, 用法

html代码

<!DOCTYPE HTML>
<html>

<head>
    <meta charset="UTF-8">
    <title>demo</title>
    <script src="/static/index/js/jquery.min.js"></script>
    <script src="/static/template-web.js"></script>
</head>

<body>
    <div id="content"></div>
    <script id="test" type="text/html">
        <h1>版本总数:{{count}}个</h1>
        <ul>
            {{each article as value i}}
            <li>{{value.version}}</li>

                {{each value.content as data j}}
                <li>{{data}}</li>
                {{/each}}

            {{/each}}
        </ul>
    </script>

    <script>
        $.post("updated/type/1", function (t) {
            var t = JSON.parse(t)
            console.log(t);
            var data = t.data;
            console.log(data);
            var html = template('test', data);
            document.getElementById('content').innerHTML = html;
        })
    </script>
</body>

</html>

(1) 特别注意红框标注部分

(2) console.log(t);结果:

(3) 页面展示效果:

appleคิดถึง

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
artTemplate循环嵌套渲染模板

功能 : 简述artTemplate的简洁用法一, 下载地址 :链接: https://pan.baidu.com/s/13dJHROtPC0oGVph1tPqyqQ提取码: 5nmg下载artTemplate后，找到template-web.js，引入到页面即可二, 引入代码:<script src="/art-template-master/lib/te...
复制链接

扫一扫