Javascript 从列表中删除元素

Question

我希望有人能帮我解决这里的问题。我有一个函数，它基本上创建一个包含用户给定输入的列表。例如：用户输入 apples，函数将 apples 添加到 <ul> 列表。

现在我有一个关于删除输入的问题。例如：我想从列表中删除 apples child。当用户输入 apples.

时，这应该发生在输入字段中

我该怎么做？

Answer 1

你可以做这样的事情：

const inputFromValue;    
const elemForDelete = Array.from(document.getElementById("myUL").children)
.find(child => child.innerText == inputFromValue ))

查找与您的输入值比较的元素文本，并从 "myUL" 中删除该元素。

Answer 2

您可以使用 jQuery 并通过运行从列表中删除项目，在列表中使用 each() 并使用 remove() 删除它，这是一个示例：

$( "button" ).click(function() { 
  var value = $('input').val() 

  $('ul li').each(function(index, li) {
    var item = $(li); 
    if(item.text() == value){
        item.remove()
    }

  }); 
});

您可以查看：https://jsfiddle.net/pww9uea8/

您可以从 jQuery 文档中查看有关 each() and remove() 的更多信息。

Javascript 从列表中删除元素

Javascript deleting elements from a list

html

javascript

css

list

appendchild