Javascript 追加儿童和#x2B；createElement不工作

以下代码块不工作

它不使用来自输入的文本创建列表元素，而是创建文本并附加它，而不创建列表元素

有人能看出我的错误在哪里吗

var-button=document.querySelector（'#btn'）；
按钮。addEventListener（'click'，handleClick）；
函数handleClick（e）{
e、 预防默认值（）；
var name=document.querySelectorAll（“#项”）；
for（设i=0；i
var name=document.querySelectorAll（“#项”）；


.querySelectorAll（）
用于获取多个元素
#
表示
id
文档中的ID必须是唯一的
按钮
的默认类型是
提交
，您不希望在此处使用它。A
常规的
按钮是您所需要的


请参见下面的其他HTML、CSS和JavaScript注释：


//仅获取一次所需元素的引用：
让warning=document.getElementById（“warning”）；
设fName=document.getElementById（“fName”）；
让lName=document.getElementById（'lName'）；
let list=document.getElementById（“项目”）；
//设置事件处理程序
document.getElementById（“btn”）.addEventListener（'click'，handleClick）；
函数handleClick（）{
//检查必填字段是否有数据
如果（fName.value==“”| | lName.value==“”）{
warning.classList.remove（“hidden”）；//无效！显示消息
return；//退出函数
}否则{
warning.classList.add（“hidden”）；//有效！隐藏消息
}
//只需要担心两个元素，每个元素都有一个唯一的id
//因此，只需对每一个进行处理。循环在这里是多余的。
//名字
var li=document.createElement（'li'）
li.className=“列表组项”；
li.textContent=fName.value；//不需要文本节点，只需设置文本内容即可
项目.儿童（李）；
fName.value=“”；
//姓
li=document.createElement（'li'）
li.className=“列表组项”；
li.textContent=lName.value；
项目.儿童（李）；
lName.value=“”；
//log（document.getElementById（'main'）.innerHTML）
}
/*CSS完成所有布局和样式设置*/
#警告{字体大小：粗体；颜色：红色；}
.hidden{display:none；}

建立联系
创造
所有字段都是必填字段。
项目

x
y
z
g

var name=document.querySelectorAll（“#项”）；


.querySelectorAll（）
用于获取多个元素
#
表示
id
文档中的ID必须是唯一的
按钮
的默认类型是
提交
，您不希望在此处使用它。A
常规的
按钮是您所需要的


请参见下面的其他HTML、CSS和JavaScript注释：


//仅获取一次所需元素的引用：
让warning=document.getElementById（“warning”）；
设fName=document.getElementById（“fName”）；
让lName=document.getElementById（'lName'）；
let list=document.getElementById（“项目”）；
//设置事件处理程序
document.getElementById（“btn”）.addEventListener（'click'，handleClick）；
函数handleClick（）{
//检查必填字段是否有数据
如果（fName.value==“”| | lName.value==“”）{
warning.classList.remove（“hidden”）；//无效！显示消息
return；//退出函数
}否则{
warning.classList.add（“hidden”）；//有效！隐藏消息
}
//只需要担心两个元素，每个元素都有一个唯一的id
//因此，只需对每一个进行处理。循环在这里是多余的。
//名字
var li=document.createElement（'li'）
li.className=“列表组项”；
li.textContent=fName.value；//不需要文本节点，只需设置文本内容即可
项目.儿童（李）；
fName.value=“”；
//姓
li=document.createElement（'li'）
li.className=“列表组项”；
li.textContent=lName.value；
项目.儿童（李）；
lName.value=“”；
//log（document.getElementById（'main'）.innerHTML）
}
/*CSS完成所有布局和样式设置*/
#警告{字体大小：粗体；颜色：红色；}
.hidden{display:none；}

建立联系
创造
所有字段都是必填字段。
项目

x
y
z
g

请将HTML添加到问题中您希望
document.querySelectorAll（“#项”）
找到什么？从输入
document.querySelectorAll（“#项”）中获取所有条目。querySelectorAll（“#项”）
在某些浏览器中工作（返回id=“item”的所有元素），但在DOM中有重复的元素id是一种不好的做法。请将HTML添加到问题中。您希望
document.querySelectorAll（“#项”）
找到什么？从输入
document获取所有条目。querySelectorAll（“#项”）
在某些浏览器中工作（返回id为=“item”的所有元素），但在您的域中有重复的元素ID是一种不好的做法。appendChild（li），将项替换为您以前创建的列表。谢谢，这解决了我的问题。@ERTEMISHAK不知道吗