空间留言板代码

创建一个简单的空间留言板,可以使用HTML和JavaScript来实现。下面是一个基本的示例代码,它允许用户输入他们的名字和留言,并将这些信息显示在页面上。这个示例非常基础,没有涉及到后端存储,所有的数据都将保存在客户端的内存中。

HTML部分

```html

简单留言板

欢迎来到我们的留言板!



<script src="script.js"></script>

```

JavaScript部分 (script.js)

```javascript

document.getElementById('messageForm').addEventListener('submit', function(event) {

event.preventDefault(); // 阻止表单默认提交行为

const name = document.getElementById('name').value;

const message = document.getElementById('message').value;

if (name && message) {

const messagesDiv = document.getElementById('messages');

const newMessage = document.createElement('div');

newMessage.innerHTML = `${name}: ${message}`;

messagesDiv.appendChild(newMessage);

// 清空输入框

document.getElementById('name').value = '';

document.getElementById('message').value = '';

} else {

alert("请填写姓名和留言!");

}

});

```

这段代码首先定义了一个简单的HTML表单,用于收集用户的姓名和留言内容。当用户点击“提交”按钮时,JavaScript会阻止表单的默认提交行为,然后获取用户输入的名字和留言,并将其格式化为HTML文本添加到页面上的`

`元素中。最后,它会清空输入框以便用户可以继续输入新的留言。

请注意,这个例子中的数据是临时存储的,刷新页面或关闭浏览器窗口后,所有留言都会丢失。如果需要持久化的数据存储,你需要考虑使用服务器端技术(如Node.js, PHP等)以及数据库(如MySQL, MongoDB等)。