<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<input
type="text"
onkeydown="addMsg(this)"
placeholder="请输入留言内容"
autofocus
/>
<ul class="list"></ul>
<script>
function addMsg(ele) {
console.log(ele);
console.log(event);
if (event.key === "Enter") {
const ul = document.querySelector(".list");
if (ele.value.length === 0) {
alert("can not null");
ele.focus();
return false;
}
const li = document.createElement("li");
li.innerHTML =
ele.value +
"   <button onclick='del(this.parentNode)'>删除</button>";
// ul.append(li);
ul.insertAdjacentElement("afterbegin", li);
ele.value = null;
ele.focus();
}
}
function del(ele) {
// if (confirm("真的要删?")) {
// ele.remove();
// // ele.outerHTML = null; //这种方式也可以删除
// }
confirm("真的要删除?") ? ele.remove() : false;
}
</script>
</body>
</html>
相关推荐
© 2020 asciim码
人生就是一场修行