📌  相关文章
📜  如何使用 JavaScript 删除添加的列表项?

📅  最后修改于: 2021-11-08 06:05:21             🧑  作者: Mango

在下面的文章中,我们将使用 JavaScript 动态添加和删除列表项。我们使用 JavaScript 动态添加和/或删除列表项,这意味着如果我们运行我们的网页,它将显示使用按钮添加和删除项的选项。

方法:在网页中,给出一个输入文本框,供用户输入添加列表项。提供了两个按钮来添加列表项和删除列表项。使用 JavaScript 函数addItem()removeItem()添加或删除列表项列表项是使用document.createElement()方法创建的,为了创建文本节点,使用document.createTextNode()方法,然后使用appendChild()方法附加该节点。使用removeChild( ) 方法删除列表项。

下面列出了使用的内置函数。

  • 创建新元素:我们可以使用document.createElement()函数创建新元素。它将动态创建元素。
  • 追加元素:我们可以使用函数appendchild()追加元素
  • 创建文本节点:我们可以使用document.createTextNode()元素创建一个文本节点。 HTML 由一个元素节点和一个文本节点组成。所以createTextNode()方法创建一个带有指定文本的文本节点。
  • 删除现有元素:我们可以使用removechild()函数从创建的列表中删除一个子元素

示例:以下代码演示了使用 JavaScript 函数添加和删除列表项。

HTML


 

 
    

 

    
                             


    输出:现在,单击添加项目将任何项目添加到列表中。单击删除项目以从列表中删除任何项目。