ejs--嵌入式js模板引擎

做页面,数据动态绑定

1.理解ejs

① 什么是模板引擎,为什么要用模板引擎

循环遍历数据显示
实现数据与试图分离(即html结构与数据分离)

②ejs

EJS是一个javascript模板库,用来从json数据中生成HTML字符串
EJS 是一套简单的模板语言,将JavaScript 代码生成 HTML 页面。
EJS 只是普通的 JavaScript代码。(可将js代码嵌入到html中且这些js代码可被解析成html)

2. 使用步骤

1.安装 npm install ejs
2.引用 var ejs = require('ejs')
3.在js中可以通过ejs.render()/renderFile()获取到ejs模板内容,并通过res.end()渲染到页面上去
可以参考博客路由那一篇
ejs.renderFile(path,data,callback)

path:模板字符串所在文件(后缀为.ejs,如果在express中配置,后缀也可为html)
data:向模板字符串传递的数据
callback:回调函数接收两个参数,一个为err,一个为str。str为解析后的html,可直接渲染到页面上
在这里插入图片描述
ejs.render( template,data)
template:模板字符串(需要用转义字符引起来)
data:给模板字符串传送的数据

3.ejs标签及使用

在这里插入图片描述

<%- 不可以转义html标签
<%= 可以转义html标签
<%_ _%> 删除前边的空格
① ejs循环

<ul>
        <% for(let i=0;i<student.length;i++){
    %>
            <li>     <%_ _%><%-student[i].name%>---<%-student[i].sex%></li>
        <%
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值