EJS模板引擎

最新推荐文章于 2024-08-31 13:58:33 发布

任123642

最新推荐文章于 2024-08-31 13:58:33 发布

阅读量426

点赞数 6

文章标签： node.js 服务器前端

本文链接：https://blog.csdn.net/weixin_66340771/article/details/135291184

版权

本文介绍了如何在Node.js环境下使用EJS模板引擎，包括安装、在Express中配置及在HTML中嵌入JavaScript动态生成内容的步骤。通过示例展示了在Express应用中渲染模板和传递数据的过程。

摘要由CSDN通过智能技术生成

1.什么是EJS模板引擎

官⽹：https://ejs.bootcss.com/
EJS（Embedded JavaScript）是一种流行的模板引擎，用于在 Node.js 环境中生成动态的 HTML 内容。EJS 允许开发者在 HTML 中嵌入 JavaScript 代码，从而可以动态地生成页面内容。以下是一个简单的示例，演示了如何在 Express 应用程序中使用 EJS 模板引擎：

步骤：

1.首先，需要使用 npm 安装 EJS 模板引擎：

npm install ejs

2.在 Express 应用程序中配置 EJS 模板引擎：

const express = require('express');
const app = express();

// 设置 EJS 模板引擎
app.set('view engine', 'ejs');
app.set('views', __dirname + '/views');

// 定义一个简单的路由
app.get('/', function(req, res) {
  res.render('index', { title: 'Hello, EJS!', message: 'This is a dynamic message.' });
});

app.listen(3000, function() {
  console.log('Server is running on port 3000');
});
const express = require('express');
const app = express();

// 设置 EJS 模板引擎
app.set('view engine', 'ejs');
app.set('views', __dirname + '/views');

// 定义一个简单的路由
app.get('/', function(req, res) {
  res.render('index', { title: 'Hello, EJS!', message: 'This is a dynamic message.' });
});

app.listen(3000, function() {
  console.log('Server is running on port 3000');
});

在上面的示例中，我们首先使用 app.set 方法来设置 Express 应用程序的模板引擎为 EJS，并指定模板文件的存放路径。然后在路由处理函数中，我们使用 res.render 方法来渲染一个名为 index.ejs 的模板文件，并向模板传递了一些动态数据。

接下来，我们可以创建一个 index.ejs 模板文件，它可以包含 HTML 和嵌入的 EJS 标签，用于动态生成页面内容：

<!DOCTYPE html>
<html>
<head>
  <title><%= title %></title>
</head>
<body>
  <h1><%= message %></h1>
</body>
</html>

任123642

关注

6
点赞
踩
8

收藏

觉得还不错? 一键收藏
1
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫