所有栏目

EJS

作者:爱百科

EJS是一个Javascript模板库,用来从JSON数据中生成HTML字符串。

EJS详细介绍

EJS是一个Javascript模板库,用来从JSON数据中生成HTML字符串。

EJS基本使用

    引入EJS

    创建一个模板

    使用视图工具组件

与最初的Javascript相比较,一些不太了解代码的人可以更容易地通过EJS模板代码看得懂代码。

EJS语法、功能

1、缓存功能,能够缓存已经解析好的html模版;

2、<% code %>用于执行其中javascript代码。

<% alert('hello world') %>

3、<%= code %>会对code进行html转义;

<h1><%=title %></h1>                    注:会把title里面存的值给显示出来在h1中。<p><%= 'hello world' %></p>             注:会把hello world显示在p中。<h1><%= '<b>hello world</b>' %></h1>    注:会把<b>hello world</b>显示在h1中。

4、<%# code %>将不会进行转义;,这一行代码不会执行,像是被注释了一样,然后显示原来的html。也不会影响整个页面的执行。

<p><%# 'hello world' %>asd</p>   最后显示asd,及显示原网页

5、支持自定义标签,比如'<%'可以使用'{{','%>'用'}}'代替;

ejs 里,默认的闭合标记是 <% .. %>,我们也可以定义自己的标签。例如:

app.set("viewoptions",{ "open":"{{", "close":"}}"});

6、提供一些辅助函数,用于模版中使用

1)、first,返回数组的第一个元素;

2)、last,返回数组的最后一个元素;

3)、capitalize,返回首字母大写的字符串;

4)、downcase,返回字符串的小写;

5)、upcase,返回字符串的大写;

6)、sort,排序(Object.create(obj).sort()?);

7)、sort_by:'prop',按照指定的prop属性进行升序排序;

8)、size,返回长度,即length属性,不一定非是数组才行;

9)、plus:n,加上n,将转化为Number进行运算;

10)、minus:n,减去n,将转化为Number进行运算;

11)、times:n,乘以n,将转化为Number进行运算;

12)、divided_by:n,除以n,将转化为Number进行运算;

13)、join:'val',将数组用'val'最为分隔符,进行合并成一个字符串;

14)、truncate:n,截取前n个字符,超过长度时,将返回一个副本

15)、truncate_words:n,取得字符串中的前n个word,word以空格进行分割;

16)、replace:pattern,substitution,字符串替换,substitution不提供将删除匹配的子串;

17)、prepend:val,如果操作数为数组,则进行合并;为字符串则添加val在前面;

18)、append:val,如果操作数为数组,则进行合并;为字符串则添加val在后面;

19)、map:'prop',返回对象数组中属性为prop的值组成的数组;

20)、reverse,翻转数组或字符串;

21)、get:'prop',取得属性为'prop'的值;

22)、json,转化为json格式字符串

7、利用<%- include filename %>加载其他页面模版;

热点导航
教育资讯 知道问答 公考资讯 司法考试 建筑知识 工作范文 大学排名 报考专业 学习方法 句子美文 秒知回答 作业解答 精选答案 知途问学