Node.js模板引擎学习----ejs

最新推荐文章于 2024-05-23 10:36:12 发布
最新推荐文章于 2024-05-23 10:36:12 发布
阅读量1k 收藏 1
点赞数
分类专栏： NodeJs点滴知识 文章标签： ejs node

环境：windows+node.js+express

一、安装ejs

打开cmd窗口，输入npm install ejs -g,等待下载安装完成。

二、使用

调用过程中使用路由机制和模板，路由请求地址为根目录，模板文件为home.ejs【注：模板引擎文件为.ejs文件】

1、新建js文件为index.js

写入如下代码：

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

varexpress=require("express");

 

varapp=express();

 

//设置渲染引擎

 

app.set("viewengine",'ejs');

 

//设置模板目录为当前index.js目录同级views目录下的模板

 

app.set("views",__dirname+"/views");

 

//设置使用当前目录

 

app.use(express.static(__dirname));

 

app.get("/",function(req,res){

 

//渲染页面并传值

 

res.render('home.ejs',{name:"kid"});

 

});

 

//监听3000端口

 

app.listen(3000);

2、新建home.js,目录为/views/home.ejs，输入如下内容：

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

<!DOCTYPEhtml>

 

<html>

 

<headlang="en">

 

<metacharset="UTF-8">

 

<title></title>

 

</head>

 

<body>

 

<h2>Hello</h2>

 

<!--<%%>:ejs的语法-->

 

<p>Hi<%=name%></p>

 

</body>

 

</html>

3、在浏览器中输入localhost:3000回车

结果如下

clip_image001

4、在网页里面引入ejs,渲染

修改home.js

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

<!DOCTYPEhtml>

 

<html>

 

<headlang="en">

 

<metacharset="UTF-8">

 

<title></title>

 

</head>

 

<body>

 

<h2>Hello</h2>

 

<!--<%%>:ejs的语法-->

 

<p>Hi<%=name%></p>

 

<divid="new-temp"></div>

 

</body>

 

<!--========================================-->

 

<scriptsrc="../ejs.min.js"></script>

 

<script>

 

vartmp="<p>Newtemplate</p>";

 

varnewTemplate=document.getElementById("new-temp");

 

newTemplate.innerHTML=ejs.render(tmp);

 

</script>

 

<!--========================================-->

 

</html>

总结：由此可以扩展到动态创建或者获取res.render()方法的locals参数，然后渲染相同的页面，第4步，就像引入jquery一样对网页进行操作。

 

 

转载：https://www.cnblogs.com/shangguanjinwen/p/4677570.html

弹琴弹琴
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
ejs模板引擎
weixin_44845533的博客
03-04 318
ejs模板引擎什么是ejs模板引擎如何使用ejs 什么是ejs模板引擎 “E” 代表什么？可以表示 “可嵌入（Embedded）”，也可以是“高效（Effective）”、“优雅（Elegant）”或者是“简单（Easy）”。EJS 是一套简单的模板语言，帮你利用普通的 JavaScript 代码生成 HTML 页面。 如何使用ejs 首先需要安装ejs npm i ejs 然后在项目内引入 c...
Node.js-一个简单快速类似ejs的node.js的模板引擎
08-10
"Node.js-一个简单快速类似ejs的node.js的模板引擎"是指一个特定的模板引擎，其设计目标是提供与流行的EJS（Embedded JavaScript）模板引擎相似的功能，但更简洁快速。 EJS是一种常见的用于Node.js的模板引擎，它...
EJS模板引擎
weixin_34023863的博客
06-15 118
前面的话 　　nodejs的模板引擎有很多， EJS是比较简单和容易上手的。本文将详细介绍EJS   概述 　　EJS是一个简单高效的模板语言，通过数据和模板，可以生成HTML标记文本。可以说EJS是一个JavaScript库，EJS可以同时运行在客户端和服务器端，客户端安装直接引入文件即可，服务器端用npm包安装 【安装】 　　ejs可以配合express框架使用，或直接在node中...
前端入门级项目——带你实现一个全栈博客项目(Ejs+Node.js+MongoDB)
最新发布
XIAO_A_fighting的博客
05-23 666
前台：① get ’ /’ 提供首页② get ‘/p’ 提供某篇文章的描述③ post ’/submitComment‘ 表单提交文章评论④get ‘/message’获取留言板⑤post‘/submitMessage’表单提交留言内容后台:①get ‘/admin/’ 后台管理首页②get’/admin/login‘ 管理员登录界面③post’/admin/login‘ 登录接口④get ‘/admin/getComment’ 获取评论。
node.js-koa-ejs-:node.js+koa+ejs模板引擎渲染
05-07
EJS则是一种轻量级的服务器端JavaScript模板引擎，用于生成HTML页面。 ### Node.js Node.js的核心特性在于它的事件驱动、非阻塞I/O模型，这使得它在处理高并发请求时表现出极高的性能。Node.js拥有丰富的npm（Node...
node.js项目---编辑修改学生信息页面
12-30
5. `views/students.ejs`：EJS模板文件，用于渲染学生信息页面，EJS是一种轻量级的视图模板引擎，支持在HTML中嵌入JavaScript代码。 为了实现编辑功能，我们需要在服务器端处理POST请求，接收到更新的学生信息后，...
Node.js-node.jsexpress项目模板
08-10
在 Node.js 中，Express 框架提供了一系列便捷的功能，包括路由处理、中间件系统、静态文件服务以及模板引擎支持等。通过使用 Express，开发者可以轻松地定义 HTTP 请求的处理方法，如 GET、POST 等，并实现相应的...
Node.js-Node.js-Express-MongoDB构建simpleblog
08-09
首先，Node.js是一个基于Chrome V8引擎的JavaScript运行环境，它允许我们在服务器端使用JavaScript编写代码，极大地提高了开发效率和跨平台能力。Node.js的非阻塞I/O模型和事件驱动特性使其在处理大量并发连接时表现...
模板引擎ejs详解
12-19 163
singsingasong.js: const ejs=require('ejs'); ejs.renderFile('./views/singsingasong.ejs', {'name':'singsingasong',json: {arr: [ {user: 'blue', pass: '123456'}, {user: 'zhangsan', pass: '654321...
Node.js 中模板引擎
youguang_的博客
01-09 1299
1.   art-template不仅可以在浏览器中试用，也可在node使用 首先，在要执行的文件目录下安装art-template，安装步骤: 在命令行所在文件后面输入：npm install art-template 然后你会发现，所在文件下会多一个目录：node_modules 这个就是我们所要找的文件，即在浏览器中需要引用这个文件； &lt;!DOCTYPE html&gt; ...
Node.js 模板引擎
m0_48942526的博客
05-06 483
模板引擎 一、什么是模板引擎？ 模板引擎是第三方模块，是一个将页面模板和要显示的数据结合生成HTML页面的工具让开发者以更友好的方式拼接字符串，使项目代码更加清晰，更加易于维护。 二、art-template模板引擎 1.使用： 在命令行工具中使用npm install are-template安装 使用const template = require(‘art-template’)引入模板引擎 需要创建两个文件，一个js文件，一个art文件 告诉模板引擎要拼接的数据和模板在哪const html = t
node.js《模板引擎》
紫月i的博客
03-14 223
模板引擎是第三方模块，让开发者以更加友好的方式拼接字符串，使项目代码更加清晰、更加易于维护 art-template模板引擎 使用npm install art-template下载 使用const template = require(‘art-template’);引入模板引擎 告诉模板引擎要拼接的数据和模板在哪 const html = template(‘模板路径’,数据); //导入模板引擎模块 const template = require('art-template'); const pat
Node.js使用模板引擎
weixin_45927758的博客
11-16 168
art-template可以在浏览器中使用，也可以在Node后端开发中使用，下面只是简单的演示一下，以后有机会会更加系统的学习 1.浏览器中使用模板 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> &.
ejs 模板引擎
qq_41340792的博客
03-22 178
ejs ejs 是js的模板引擎， 可以识别一些简单的js语句和使用一些js简单表达式 ejs 的语法 流程控制语句 if语句 <% js代码 %> if语句 // js 的if 语句格式 <% if(条件) { %> // 处理的逻辑 渲染的HTML结构 <% } %> if-else语句 // js 的if 语句格式 <% if(条件) { %> // 处理的逻辑 渲染的HTML结构 <% }else { %> // 处理的
Node.js篇-1.模板引擎
雨过天晴后的博客
11-26 363
模板引擎 基础概念 模板引擎 第三方模块 让开发者以更加友好的方式拼接字符串,使项目代码更加清晰,易于维护 art-template模板引擎 Npm install art-template下载 const template = require('art-template')引入模板引擎 const html = template('模板路径',数据); 告诉模板引擎要拼接的数据和模板在哪 art-template代码示例 // 导入模板引擎模块 const template = require('a
nodejs之模板引擎（渲染模板）
PILIpilipala的博客
10-15 2986
模板引擎模板引擎简介语法模板核心方法template（filename，data）template.compile（source，options）template.render（source，data，options）案例---渲染查询出来的成绩 模板引擎简介 art-template是一个简单且超快速的模板引擎，可通过范围内预先声明的技术优化模板渲染速度，从而实现接近JavaScript极限的运行时性能。同时，它同时支持NodeJS和浏览器。 特征 性能接近JavaScript渲染限制 调试友好。语法错
Node.js实战：构建高性能Web应用与模块化设计
大多数Node.js的示例和库都围绕着Web开发展开，包括http框架（如Express）、模板引擎（如EJS或Pug）等，这些都是为了简化网络服务的开发过程。 对于想要学习Node.js的读者，本书《Node入门》是一个很好的起点。它...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值