JavaScript# DOM实现留言板

最新推荐文章于 2022-06-28 20:04:28 发布

原创

最新推荐文章于 2022-06-28 20:04:28 发布 · 1.9k 阅读

8 ·

CC 4.0 BY-SA版权

这篇博客展示了如何使用JavaScript动态创建DOM元素来实现一个简单的留言板功能。当用户在文本框输入信息并点击‘发表’按钮后，信息会被显示为一个可删除的消息条目。点击消息上的'X'按钮，消息会逐渐消失。该实现包括了文本验证、元素创建、事件监听及动画效果。

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>Document</title>
   <style>
       .wrap{
           width: 500px;
           /*height: 400px;*/
           border: 3px solid black;
           /*position: relative;*/
           top: 0;
           left: 0;
           padding: 50px;
           margin: 0 auto;

       }
       .textBox{
           width: 500px;
           height: 250px;
           border: 1px solid #CBA4C3;
           margin: 0 auto;
       }
       .send{