AJAX里使用模板引擎

最新推荐文章于 2024-08-18 10:54:05 发布

weixin_30410119

最新推荐文章于 2024-08-18 10:54:05 发布

阅读量82

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/EricZLin/p/9228989.html

版权

一、概述：

处理响应数据渲染可以使用模板引擎（实际上就是一个API，目的是更容易的将数据渲染到HTML中）
目前市面上有许多模板引擎，可以参考
推荐使用artTemplate，它采用作用域预声明的技术来优化模板渲染速度，同时支持 NodeJS 和浏览器。

二、模板引擎步骤：

①选择一个模板引擎，下载模板引擎文件

②引入到页面中

③准备一个模板

④准备一个数据

⑤通过模板引擎的js提供的一个函数将模板和数据整合得到渲染结果HTML

⑥将渲染结果的HTML设置到默认元素的innerHTML中

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <p id="p"></p>
    <script src="lib/template-web.js"></script>
    <script type="text/template" id="tpl">
        我叫 {{name}}
        我来自 {{provices}}
        我的爱好是 {{each hobbies}} {{$value}} {{/each}} 
    </script>
    <script>
        var data={
            name:'eric',
            provices:'江西',
            hobbies:['代码','运动','电脑游戏']
        }
        var ret=template('tpl',data);
        var p=document.getElementById('p');
        p.innerHTML=ret;
    </script>
</body>
</html>

三、模板写入script的原因

如果写入到JS变量中，维护不方便，不能换行，没有着色
写入到script标签中，innerHTML不会显示在界面上
注意：script标签里如果type类型不是text/JavaScript，标签内容不会安装js文件执行

四、参考:JavaScript模板引擎实例应用

转载于:https://www.cnblogs.com/EricZLin/p/9228989.html

weixin_30410119

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
AJAX里使用模板引擎

一、概述：处理响应数据渲染可以使用模板引擎（实际上就是一个API，目的是更容易的将数据渲染到HTML中）目前市面上有许多模板引擎，可以参考推荐使用artTemplate，它采用作用域预声明的技术来优化模板渲染速度，同时支持 NodeJS 和浏览器。二、模板引擎步骤：①选择一个模板引擎，下载模板引擎文件②引入到页面中③准备一个模板④准备一个...
复制链接

扫一扫