JavaScript模拟留言板

JavaScript可以用来模拟一个简单的留言板功能，它通常包括以下几个步骤：

1. 创建HTML结构：首先，你需要在HTML中创建一个包含表单的部分，包括输入框（用于用户留言）、提交按钮以及显示留言列表的部分。

<div id="message-board">
  <h2>留言板</h2>
  <form id="comment-form">
    <input type="text" placeholder="请输入您的留言...">
    <button type="submit">提交</button>
  </form>
  <ul id="messages"></ul>
</div>

2. JavaScript处理表单：利用JavaScript监听表单的`onsubmit`事件，防止默认提交并获取用户输入的信息。

const form = document.getElementById('comment-form');
form.addEventListener('submit', function(e) {
  e.preventDefault(); // 阻止表单自动提交
  const commentInput = form.querySelector('input[type="text"]');
  const newComment = commentInput.value;
  // 进行处理...
});

3. 存储和展示留言：你可以选择本地存储（如localStorage、sessionStorage）或服务器端（通过Ajax请求）来保存用户的留言。然后，在`ul`元素里动态添加新的li项来显示留言。

function addMessage(newComment) {
  const messagesList = document.getElementById('messages');
  const newLi = document.createElement('li');
  newLi.textContent = newComment;
  messagesList.appendChild(newLi);
}

// 调用addMessage函数并将新评论作为参数传递
addMessage(newComment);

4. 可选：为了更好的用户体验，可以提供分页、搜索等功能，并优化前端样式使其更美观。