留言板

最新推荐文章于 2019-05-30 20:06:04 发布

雨吖

最新推荐文章于 2019-05-30 20:06:04 发布

阅读量219

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/weixin_44901335/article/details/89319002

<!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 "createLange()">点击留言</button>
</body>
<script type="text/javascript">
	 var item = document.getElementsByClassName("items")[0];  //获取ul元素
        function createLange(){
            var val = text.value;           //获取文本框里的内容
            var li = document.createElement("li");           //创建一个节点
                li.innerHTML = val;             //将从文本框中获取的内容赋值给li
                item.appendChild(li);      //获取子节点 
                text.value = "";        //清空文本域

            //生成一个按钮
            var btn = document.createElement("button");      //创建一个按钮        
                btn.innerHTML = "删除";       //按钮获取内容
                li.appendChild(btn);        //把btn放到li的末尾
                btn.onclick = function(){       //点击按钮时的函数
                    item.removeChild(li);         //将当前选中的子节点删除
                }
        }
</script>
</html>