当然可以，在网页上添加一个
留言板块是很常见的功能。我们可以使用表单来实现这个功能。
1. 在 HTML 文件中添加一个表单，用于
留言：
```html
<div id="content">
<h1>林俊杰</h1>
<p>林俊杰，1981年3月27日出生于新加坡，华语流行歌手、音乐制作人、演员、MV导演、作曲家兼编曲家。2003年，林俊杰凭借个人第一张专辑《乐行者》正式出道。其后，林俊杰凭借多首脍炙人口的歌曲在华语乐坛获得了极高的知名度和影响力。</p>
<h2>
留言板</h2>
<form method="POST" action="/messages">
<label for="name">姓名：</label>
<input type="text" name="name" id="name" required><br><br>
<label for="email">邮箱：</label>
<input type="email" name="email" id="email" required><br><br>
<label for="message">
留言：</label><br>
<textarea name="message" id="message" required></textarea><br><br>
<input type="submit" value="提交">
</form>
</div>
```
2. 在 Node.js 后端代码中添加一个路由，用于处理表单提交：
```javascript
const qs = require('querystring');
const server = http.createServer((req, res) => {
if (req.url === '/') {
// ...
} else if (req.method === 'POST' && req.url === '/messages') {
let body = '';
req.on('data', chunk => {
body += chunk.toString();
});
req.on('end', () => {
const data = qs.parse(body);
console.log(data);
// 在这里将
留言存储到数据库中或者发送电子邮件
res.writeHead(303, { 'Location': '/' });
res.end();
});
} else {
res.writeHead(404);
res.end('Page not found');
}
});
```
上述代码将在 `/messages` 路由上处理 POST 请求，并将表单数据解析为 JavaScript 对象。您可以根据需要，将这些数据存储到数据库中或者发送电子邮件。在示例中，我们仅仅将这些数据打印到控制台上。
3. 在网页上添加样式，使得
留言板块更加美观：
```html
<style>
/* ... */
form {
background-color: rgba(0, 0, 0, 0.7);
padding: 20px;
}
label {
display: inline-block;
width: 80px;
font-size: 16px;
font-weight: bold;
margin-bottom: 10px;
}
input[type="text"],
input[type="email"],
textarea {
font-size: 16px;
padding: 10px;
border: none;
border-radius: 5px;
box-shadow: inset 0 0 5px #fff;
width: 100%;
margin-bottom: 20px;
background-color: rgba(255, 255, 255, 0.7);
}
input[type="submit"] {
background-color: #FFD700;
border: none;
padding: 10px 20px;
border-radius: 5px;
color: #000;
font-size: 16px;
font-weight: bold;
cursor: pointer;
}
input[type="submit"]:hover {
background-color: #F8A800;
}
</style>
```
这样，您就可以在网页上添加一个
留言板块了。用户可以在表单中填写姓名、邮箱和
留言，然后提交表单。在后端，我们将表单数据解析为 JavaScript 对象，并可以将这些数据存储到数据库中或者发送电子邮件。
扫一扫
513
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
