<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>留言板</title>
</head>
<body>
<input type="text"><input type="button" value="请留言">
<ul></ul>
<script>
//获取页面元素
var oInp = document.querySelectorAll(‘input‘);
var oUl = document.querySelector(‘ul‘);
//给按钮添加点击事件
oInp[1].onclick = function(){
//获取文本框中的内容
var str = oInp[0].value;
//创建li
var oLi = document.createElement(‘li‘);
//创建文本节点
var oTxt = document.createTextNode(str);
oLi.appendChild(oTxt);
//创建a
var oA = document.createElement(‘a‘);
oA.href = "javascript:;"//将a作为js中的按钮用，不再跳转
//设置a中的内容
oA.innerHTML = ‘删除‘;
oA.onclick = function(){
this.parentNode.parentNode.removeChild(this.parentNode);
}
oLi.appendChild(oA);
if(oUl.firstChild){
oUl.insertBefore(oLi,oUl.firstChild);
}else{
oUl.appendChild(oLi);
}
}
</script>
</body>
</html>
