Nodejs中如果不用ejs 不用jade，直接写html配合node 可以么？

Nodejs中如果不用ejs 不用jade，直接写html配合node 可以么？

如果不用ejs 不用jade，直接写html配合node 可以么？ 不懂 为什么脱裤子放屁写jade

12 回复

当然可以！在Node.js中，你完全可以直接使用HTML文件，而不需要依赖于模板引擎如EJS或Jade（现在称为Pug）。这样做可能更直观，尤其是在你已经熟悉HTML的情况下。不过，为了实现动态内容生成，你可以利用Node.js来读取HTML文件并在需要时插入动态数据。

示例代码

首先，我们创建一个简单的HTML文件 index.html：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Example Page</title>
</head>
<body>
    <h1>Welcome to the Example Page!</h1>
    <p id="dynamic-content">This is some dynamic content.</p>
</body>
</html>

接下来，我们创建一个简单的Node.js服务器来读取并显示这个HTML文件，并根据需要插入动态内容。

const http = require('http');
const fs = require('fs');
const path = require('path');

// 创建HTTP服务器
const server = http.createServer((req, res) => {
    if (req.url === '/') {
        // 设置响应头为HTML类型
        res.writeHead(200, { 'Content-Type': 'text/html' });

        // 读取HTML文件
        const filePath = path.join(__dirname, 'index.html');
        fs.readFile(filePath, (err, data) => {
            if (err) {
                res.writeHead(500);
                res.end('Internal Server Error');
                return;
            }

            // 动态修改HTML内容
            const modifiedHtml = data.toString().replace(
                '<p id="dynamic-content">This is some dynamic content.</p>',
                '<p id="dynamic-content">Hello, Node.js!</p>'
            );

            // 发送修改后的HTML
            res.end(modifiedHtml);
        });
    } else {
        res.writeHead(404);
        res.end('Not Found');
    }
});

server.listen(3000, () => {
    console.log('Server running at http://localhost:3000/');
});

在这个例子中，我们首先创建了一个HTTP服务器，监听端口3000。当访问根路径 / 时，服务器会读取 index.html 文件，并将其中的静态文本替换为动态内容，然后发送给客户端。

解释

  1. HTML文件：创建了一个基本的HTML页面，包含一些静态文本。
  2. Node.js服务器：使用内置的 http 模块创建服务器。服务器读取HTML文件，并在返回给客户端之前对内容进行修改。
  3. 动态内容处理：通过字符串替换的方式，在HTML中插入动态数据。

这种方式虽然简单，但要注意，对于复杂的应用场景，使用模板引擎如EJS或Pug可能会更加方便和高效。


当然也可以… 不过这种办法不够对方各种场景的. 手写 HTML 效率太低了.

res.write('<!DOCTYPE html>\n')
res.write('<html lang="zh-cn">\n')
res.write('<head>\n')
res.write('<meta charset="utf-8">\n')
res.write('<title>NodeJS</title>\n')
res.write('</head>\n')
res.write('</html>\n')
res.end()

怎么不可以呢？

不容易改啊，维护很困难，很难看懂

engine->html

这两天一直在弄这个，很蛋痛，手写的话，一直报错，后买用dreawear写好html代码后，在用html2jade转，那缩进风格的语法真的很难适应

直接弄个 html 模板引擎呗。比如https://www.npmjs.org/package/ydr-template

不用这些东西，也无非是你自己写一套基于HTML的模板。ejs跟HTML已经很像了，楼主为什么不想用呢？

node输出json api 客户端用angularjs之类的框架

你希望一个前端工程师改几个标签文案、图片或者描述都要去动你的node代码吗？真不敢想想0.0

Jade你用多了 自然就发现好处了 HTML 太麻烦了 就算你用Zencoding

当然可以！在Node.js中，你可以直接将HTML文件与Node.js代码结合使用。这种方式更加直观，不需要额外的学习成本，特别是如果你已经熟悉HTML。

示例

假设你有一个简单的HTML文件 index.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Home Page</title>
</head>
<body>
    <h1>Welcome to My Website!</h1>
    <p>The current date is: <span id="date"></span></p>

    <script>
        document.getElementById('date').innerText = new Date().toLocaleDateString();
    </script>
</body>
</html>

现在，我们可以用Node.js来处理这个HTML文件，并在其中插入动态数据：

const http = require('http');
const fs = require('fs');

const hostname = '127.0.0.1';
const port = 3000;

const server = http.createServer((req, res) => {
    fs.readFile(__dirname + '/index.html', 'utf8', (err, data) => {
        if (err) {
            console.error(err);
            res.statusCode = 500;
            res.end('Internal Server Error');
            return;
        }

        // 在这里可以修改data中的内容，比如插入当前时间
        const currentDate = new Date().toLocaleDateString();
        data = data.replace('<span id="date"></span>', `<span id="date">${currentDate}</span>`);

        res.statusCode = 200;
        res.setHeader('Content-Type', 'text/html');
        res.end(data);
    });
});

server.listen(port, hostname, () => {
    console.log(`Server running at http://${hostname}:${port}/`);
});

在这个例子中，我们创建了一个HTTP服务器，当用户访问该服务器时，它会读取并返回 index.html 文件的内容。我们还可以在发送给客户端之前对文件内容进行修改或添加动态数据。

这种方式虽然简单直接，但在处理复杂的Web应用时可能不够高效，因为你需要手动管理模板和数据绑定。对于小型项目或快速原型开发，这可能是非常方便的。

回到顶部