<body>
<textarea name="" id="" cols="30" rows="10"></textarea>
<button>添加</button>
<!-- 创建个ul用来存放添加的节点li -->
<ul>
</ul>
<script>
//获取元素
var textarea = document.querySelector('textarea');
var btn = document.querySelector('button');
var ul = document.querySelector('ul');
//1. 添加信息
//注册事件
btn.onclick = function() {
//创建节点li
if (textarea.value == '') {
alert('请输入内容!'); //(1).如果textarea 内容为空
return false;
} else { // (2) .如果textarea 里面有内容
// 创建li节点
var li = document.createElement('li');
//先有li,才能将文本域的内容赋值给li,后面再带上个删除链接
li.innerHTML = textarea.value + "<a href='javascript:;'>删除</a>";
// li 放进 ul 里面
ul.appendChild(li);
//insertBefore 将最新的评论添加到最上面 ,ul.children[0]---最新的元素
ul.insertBefore(li, ul.children[0])
//添加完 再将textarea 内容置空
textarea.value = '';
}
// 2.删除信息
//删除元素 获取a链接
var a= document.querySelector('a');
//绑定事件
a.onclick = function(){
//点击事件 删除(li元素),ul.removeChild,a.parentNode 删除ul的子节点,a的父节点 ---li
ul.removeChild(a.parentNode);
}
}
</script>
</body>
08-21
213
04-02
325
01-29
404