收藏
PHPz批改状态：合格
老师批语：整体效果实现了, 但是没有写css
改写留言板案例,适当添加CSS美化
<!DOCTYPE html><html lang="zh-cn"><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>todolist:留言板</title></head><body><input type="text" onkeydown="insertComment(this)" placeholder="请输入留言" autofocus /><ul class="list"></ul><script>const insertComment = function (ele) {// console.log(enent);// console.log(enent.type);//if (event.key === "Enter") {if (ele.value.length === 0) {alert("留言不能为空");ele.focus();return false;}const ul = document.querySelector(".list");ele.value += `<button onclick="del(this.parentNode)">删除</button>`;ul.insertAdjacentHTML("afterbegin", `<li>${ele.value}</li>`);ele.value = null;}};const del = function (ele) {return confirm("是否删除?") ? (ele.outerHTML = null) : false;};</script></body></html>
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
