美文网首页
Express系列(七)

Express系列(七)

作者: 笑红尘123 | 来源:发表于2019-12-08 10:50 被阅读0次

    express模版引擎之ejs

    随着前端业务的不断发展,页面交互逻辑的不断提高,让数据和界面实现分离渐渐被提了出来。JavaScript的MVC思想也流行了起来,在这种背景下,基于node.js的模板引擎也随之出现。

    什么是模板引擎?

    它用于解析动态数据和静态页面所生成的视图文件,将原本静态的数据变为动态,快速地实现页面交互;
    目前使用较广的模板引擎有以下几种:Jade / Pug、EJS、Handlebars。

    一、什么是ejs?

    高效的 JavaScript 模板引擎。
    "E" 代表 "effective",即【高效】。EJS 是一套简单的模板语言,帮你利用普通的 JavaScript 代码生成 HTML 页面。EJS 没有如何组织内容的教条;也没有再造一套迭代和控制流语法;有的只是普通的 JavaScript 代码而已。

    二、ejs的基本使用

    //app.js
    const express=require("express");
    const ejs=require("ejs");
    const fs=require("fs");
     
    var app=express();
     
    //引用ejs
    app.set('views',"public");  //设置视图的对应目录
    app.set("view engine","ejs");       //设置默认的模板引擎
    app.engine('ejs', ejs.__express);       //定义模板引擎
     
    app.get("/",function(req,res){
        res.render("index.ejs",{title: "<h1>express</h1>"});
    });
     
    app.listen(3000);
    
    //index.ejs
    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8">
            <title></title>
        </head>
        <body>
            <% for(var i=0;i<10;i++){ %>
                <%= i %>
            <% } %>
            <!-- 获取变量 -->
            <div class="datas">
                <p>获取变量:</p>
                <%- title %>
                <%= title %>
            </div>
        </body>
    </html>
    

    三、ejs标签各种含义

    <% '脚本' 标签,用于流程控制,无输出。
    <%_ 删除其前面的空格符
    <%= 输出数据到模板(输出是转义 HTML 标签)
    <%- 输出非转义的数据到模板
    <%# 注释标签,不执行、不输出内容
    <%% 输出字符串 '<%'
    %> 一般结束标签
    -%> 删除紧随其后的换行符
    _%> 将结束标签后面的空格符删除
    

    四、option的配置:

    cache       缓存编译后的函数,需要提供 filename
    filename    被 cache 参数用做键值,同时也用于 include 语句
    context     函数执行时的上下文环境
    compileDebug 当为 false 时不编译调试语句
    client      返回独立的编译后的函数
    delimiter   放在角括号中的字符,用于标记标签的开与闭
    debug       将生成的函数体输出
    _with       是否使用 with() {} 结构。如果为 false,所有局部数据将存储在 locals 对象上。
    localsName  如果不使用 with ,localsName 将作为存储局部变量的对象的名称。默认名称是 locals
    rmWhitespace 删除所有可安全删除的空白字符,包括开始与结尾处的空格。对于所有标签来说,它提供了一个更安全版本的 -%> (在一行的中间并不会剔除标签后面的换行符)。
    escape  为 <%= 结构设置对应的转义(escape)函数。它被用于输出结果以及在生成的客户端函数中通过 .toString() 输出。(默认转义 XML)。
    

    如果感觉有帮助留下一个宝贵的赞或者给小编一个赞赏!!!

    相关文章

      网友评论

          本文标题:Express系列(七)

          本文链接:https://www.haomeiwen.com/subject/qrfpgctx.html