资讯专栏INFORMATION COLUMN

前端模板 mustache

geekidentity / 2372人阅读

摘要:最近因工作需要接触到首先什么是呢模板语法的逻辑比较简单。它用于,配置文件,源代码等。它的工作方式是通过通过以哈希值或者对象的方式扩展模板标签。

最近因工作需要接触到 mustache.

首先什么是mustache呢

Mustache 模板语法的逻辑比较简单。它用于HTML,配置文件,源代码等。它的工作方式是通过通过以哈希值或者对象的方式扩展模板标签。

github 项目地址

mustache.js

mustache简单使用

1.简单的变量调换:{{name}} 示例如下 :

var data = { "name": "Willy" };
Mustache.render("{{name}} is awesome.",data); //Willy is awesome.

2.若是变量含有html的代码的,例如:
等等而不想转义可以在用{{&name}} 示例如下 :

var data = {"name" : "
Willy
"}; var output = Mustache.render("{{&name}} is awesome.", data); //
Willy
is awesome.

PS : 去掉"&"的成果是转义为:
Willy
is awesome.

3.mustache 和 PHP 结合使用

在没使用mustache之前,使用ajax获取到数据之后,是通过 拼接html代码来实现的,大概如下 :

var $tpl = $("
  • "); $tpl.find(".name").text("XXX");

    引入mustache之后 代码如下 :

    
    
    
    
        //PHP代码
    
        $arr = array(
                array("id"=>1,"name"=>"小茗同学"),
                array("id"=>1,"name"=>"小莉同学")
            );
    
        exit(json_encode($arr));
    结尾

    关于mustache 还有很对其他的使用方法,作者在github也给出详细的示例.

    github项目主页 传送门
    最后.本人非专业前端,如有错误 还望指正

    文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

    转载请注明本文地址:https://www.ucloud.cn/yun/85951.html

    相关文章

    • Mustache学习笔记

      摘要:一个返回值渲染后的例那年那夏我是,年龄结果我是那年那夏,年龄的思想的核心是标签和。从上面的代码中可以看到定义模板时,使用了这样的标记,这就是的标签,只不过它用替代了,以免跟标签的混淆。 Mustache学习笔记 Mustache 是一款基于javascript 实现的模板引擎,类似于 Microsoft’s jQuery template plugin,但更简单易用,在前后端分离的技术...

      qylost 评论0 收藏0
    • js模版引擎介绍

      摘要:使用方法编译模板并根据所给的数据立即渲染出结果仅编译模版暂不渲染,它会返回一个可重用的编译后的函数根据给定的数据,对之前编译好的模板进行数据渲染参考资料模板引擎概述 js模版引擎介绍 JavaScript 模板是将 HTML 结构从包含它们的内容中分离的方法。模板系统通常会引入一些新语法,但通常是非常简单的,一个要注意的有趣的点是,替换标记通常是由双花括号({ {……} })表示,这也...

      duan199226 评论0 收藏0
    • 字符串与JavaScript之间的魔术—前端模板的原理及简单实现

      摘要:大多数模板实现原理基本一致模板字符串首先通过各种手段剥离出普通字符串和模板语法字符串生成抽象语法树然后针对模板语法片段进行编译,期间模板变量均去引擎输入的变量中查找模板语法片段生成出普通片段,与原始普通字符串进行拼接输出。 前端模板的发展 模板可以说是前端开发最常接触的工具之一。将页面固定不变的内容抽出成模板,服务端返回的动态数据装填到模板中预留的坑位,最后组装成完整的页面html字符...

      Steve_Wang_ 评论0 收藏0
    • mustache:web模板引擎

      摘要:简介是一个轻逻辑模板解析引擎,它的优势在于可以应用在等多种编程语言中。这里主要是看中的应用。 mustache简介 Mustache 是一个 logic-less (轻逻辑)模板解析引擎,它的优势在于可以应用在 Javascript、PHP、Python、Perl 等多种编程语言中。这里主要是看JavaScript中的应用。Javascript 语言的模板引擎,目前流行有 Mustac...

      klivitamJ 评论0 收藏0

    发表评论

    0条评论

    最新活动
    阅读需要支付1元查看
    <