ejs模板基础用法

本文介绍了EJS模板引擎在Node.js中的应用,用于生成动态页面。与静态HTML+JS相比,EJS提供了更高的安全性和流畅性。文章详细讲解了EJS的常用标签,如流程控制、输出和注释,并给出了实例,包括<% %>, <%= %>和<%include %>的使用方法。" 53353837,1364097,Autodesk Forge 问题求助指南,"['Autodesk', 'Forge', 'API', '开发者支持', '问题解决']
摘要由CSDN通过智能技术生成

前言

ejs是适合在node.js中生成动态页面的模板,可以根据后端数据库中的数据按照一定逻辑处理渲染页面。

其实静态html页面配合js,js通过http获取后端数据后也能动态渲染页面。但是这样是有缺点的。

静态页面+js 的缺点:

  • 不安全。把后端数据库的内容通过http发到前端进行解析再渲染页面,http接口容易被盗用,后端数据库数据被盗。
  • 不流畅。整个页面的渲染分2步,先加载页面文件然后js再通过http获取数据渲染页面,2步之间存在一定间隔。

使用动态页面生成模板则可以避免这些缺点,页面文件在后端直接动态生成。

常用标签

  • <% %> 流程控制标签,可以嵌入js
  • <%= %> 输出标签(原文输出HTML标签)
  • <%- %> 输出标签(HTML会被浏览器解析)
  • <%# %> 注释标签
  • % 对标记进行转义
  • -%> 去掉没用的空格
  • <%include %> 包含文件

示例

node.js中调用方法:

exports.index = function(req, res) {
  res.render('website/index/index',{show_msg:1,msg1:"111",msg2:"222"});
}
1、<%= %>与<%- %>
<%=hello%>        会在html页面上显
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
ejs.render()是一个ejs模板引擎的渲染方法,它可以将一个ejs模板文件和数据对象作为参数,返回一个渲染后的HTML字符串。 在代码中使用ejs.render()方法,需要先安装ejs模块,并在代码中引入该模块。然后,需要定义一个ejs模板文件,其中可以使用ejs模板语法来动态地插入数据。 例如,我们可以定义一个名为"template.ejs"的模板文件,其中包含以下内容: ```html <html> <head> <title><%= title %></title> </head> <body> <h1>Welcome <%= name %></h1> </body> </html> ``` 在这个模板文件中,"<%= %>"是ejs模板语法中用来插入数据的标记,其中"title"和"name"是我们需要动态渲染的数据属性。 接下来,在代码中我们需要定义一个数据对象,包含需要渲染的数据属性,例如: ```javascript const data = { title: "My Website", name: "John" }; ``` 最后,我们使用ejs.render()方法将模板文件和数据对象作为参数传入,然后将返回的HTML字符串输出到页面中,例如: ```javascript const ejs = require("ejs"); const fs = require("fs"); const template = fs.readFileSync("template.ejs", "utf8"); const data = { title: "My Website", name: "John" }; const html = ejs.render(template, data); console.log(html); ``` 在这个例子中,我们首先使用fs模块读取模板文件,然后使用ejs.render()方法将模板文件和数据对象渲染为HTML字符串。最后,我们将渲染后的HTML字符串输出到控制台中。 当然,在实际使用中,我们通常会将渲染后的HTML字符串输出到客户端浏览器中,例如: ```javascript res.writeHead(200, {"Content-Type": "text/html"}); res.write(ejs.render(template, data)); res.end(); ``` 这样就可以动态地渲染ejs模板文件中的数据了。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值