<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>留言板</title>
</head>
<body>
<input type="text" id="text">
<button id="btn">留言</button>
<ul id="ul1">
</ul>
</body>
</html>
<script>
//输入内容，点击留言，创建一个 li ，新留言内容 置顶
// 超过5条留言 删除第一条...
function $id(id) {
return document.getElementById(id);
}
$id("btn").onclick = function () {
//创建li
var li = document.createElement("li")
//创建的li值来源input框
li.innerHTML = $id("text").value;
//将创建的li插入到firstElementChild第一个儿子元素节点（不包含文本节点）前；
//$id("ul1").firstElementChild父节点的某个子节点
$id("ul1").insertBefore(li, $id("ul1").firstElementChild)
//ul1.children.length所有子节点（不包含文本节点，此处的文本节点是空格）的长度
if (ul1.children.length == 6) {
ul1.lastElementChild.remove();
}
}
</script>
在这里插入代码片
2044
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
