如何过滤新列表元素?

Question

很抱歉代码太长，但自昨晚以来我一直在努力找到问题。目标是：

• 当用户输入任何列表值时，它会创建一个包含该值的新列表。
• 当用户单击指定列表的删除按钮时，该按钮将被删除。
当用户在搜索栏中输入任何值
• 时，如果任何列表值等效于搜索输入，则应显示该值。

• 问题是当我在搜索栏中输入列表值时，它不会显示任何内容

  const btn = document.querySelector("input[type=submit]");
  const ulTag = document.querySelector("ul");
  const form = document.querySelector("form");
  const search = document.querySelectorAll("input")[0];
  form.addEventListener("submit", createElement);
  search.addEventListener("keyup", filterItems);
  function createElement(e) {
  e.preventDefault();
  const input = document.querySelectorAll("input")[1];
  const lists = document.createElement("li");
  const removebtn = document.createElement("button");
  removebtn.className = "btn btn-danger btn-sm float-right delete";
  lists.className = "li";
  removebtn.appendChild(document.createTextNode("X"));
  const listsValue = document.createTextNode(input.value);
  lists.appendChild(removebtn);
  lists.appendChild(listsValue);
  ulTag.appendChild(lists);
  if (input.value === "") {
  form.removeEventListener("submit", createElement);
  }
  }
  
  function filterItems(e) {
  const searchInput = e.target.value.toLowerCase();
  let allItems = ulTag.getElementsByTagName("li");
  Array.from(allItems).forEach(list => {
  let itemNames = list.firstChild.textContent;
  if (itemNames.toLowerCase().indexOf(searchInput) != -1) {
  list.style.display = "block";
  } else if (itemNames.toLowerCase().indexOf(searchInput) == -1) {
  list.style.display = "none";
  }
  });
  }
  

Answer 1

一个问题： 答：itemNames 应该等于 list.lastChild.textContent;