本文介绍了一个简单的留言板功能实现方法，通过HTML、CSS和JavaScript创建一个可以添加和删除留言的交互式界面。用户可以在文本框中输入留言，点击按钮将留言添加到页面上，每个留言旁边都有一个删除按钮，方便用户管理自己的留言。
HTML代码：
//主要思路：创建一个装li的容器，让留言可以实现所需效果。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>留言板</title>
</head>
<body>
<ul class="items"></ul>
<textarea name="" id="text" cols="30" rows="10"></textarea>
<button onclick="createLange()">点击留言</button>
</body>
javascript代码：
<script type="text/javascript">
var item = document.getElementsByClassName("items")[0]; //获取ul和下标；
function createLange(){ //创建函数
var val = text.value; //把textarea的内容取出来
var li = document.createElement("li"); //创建li容器装textarea里输入的内容
li.innerHTML = val; //创建li容器装textarea里输入的内容
item.appendChild(li); //插入节点，把li放入合适位置
text.value = "";
var btn = document.createElement("button"); //创建按钮，用来删除li内容
btn.innerHTML = "删除";
li.appendChild(btn); //把按钮插入li后面
btn.onclick = function(){
item.removeChild(li); //remoceChid删除节点，使button按钮生效
}
}
</script>
扫一扫
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
