脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-js模板引擎渲染artTemplate教程，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

小宝典致力于为广大程序猿（媛）提供高品质的代码服务，请大家多多光顾小站，小宝典在此谢过。

引入js文件

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

在body中定义容器

<p id="content"></p>

创建template

&nbsp;<script id="test" tyPE="text/htML">

        {{if isAdmin}}

        <ul>

            {{@R_304_2428@ Unusable_Systems value i}}

            <li>索引 {{i + 1}} ：{{Unusable_systems[i].name}}</li>

            {{/each}}

        </ul>

            {{each Unusable_systems value i}}

            <p class="responsive" id="system1">

                <p class="img">

                    <a target="_blank" href="img_forest.jpg">

                        <img src=https://www.2cto.COM/uploaDFile/2018/0208/20180208020252503.jpg" alt="Forest" width="600" height="400">

                    </a>

                    <p class="desc">

                        索引 {{i + 1}} ：{{Unusable_systems[i].name}}

                       </p>

                </p>

            </p>

            {{/each}}

        {{/if}}

        {{$data}}

    </script>

使用

    <script>

        VAR data = {

            tITle: &#39;基本例子',

            isAdmin: true,

            list: ['文艺', '博客', '摄影', '电影', '民谣', '旅行', '吉他']

        };

         var datatest = { isAdmin: true,Unusable_systems:[{id:"1",name:"system1"},{id:"2",name:"system2"}]};

        /*var html = template('test', data);  "Unusable_systems":[{"id":"1","name":"system1"},{"id":"2","name":"system2"}]*/

        /*var html = template('test', datatest);*/

        var html = template('test', datatest);

        document.getElementById('contenttest').innerHTML = html;

</script>

觉得可用，就经常来吧！ 脚本宝典 欢迎评论哦！ js脚本，巧夺天工，精雕玉琢。小宝典献丑了！

脚本宝典总结

以上是脚本宝典为你收集整理的javascript代码实例教程-js模板引擎渲染artTemplate教程全部内容，希望文章能够帮你解决javascript代码实例教程-js模板引擎渲染artTemplate教程所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。