在 JavaScript 中，我们经常需要删除某个元素。特别是在使用列表时，我们可能需要删除某个列表项。当我们需要删除整个 li 时，我们使用的方法是非常简单的。下面来具体介绍。 在 HTML 中，一个典型的列表项代码如下：

<ul>
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
</ul>

当我们需要删除某个 li 时，首先需要选中该元素。我们可以使用 document.querySelector() 或 document.querySelectorAll() 进行选择。例如，我们想删除第二个列表项，可以使用以下代码：

let listItem = document.querySelectorAll('li')[1];

这里使用了 document.querySelectorAll() 方法来选择第二个 li，索引为 1 的元素。请注意，它返回的是一个 NodeList 对象，而不是 DOM 节点。因此我们需要使用索引来选择所需的元素。 接下来，我们可以使用 parentNode.removeChild() 方法来删除 li。这里 parentNode 是指该节点的父节点，removeChild() 方法用于从 DOM 中删除该节点。完整代码如下：

let listItem = document.querySelectorAll('li')[1];
listItem.parentNode.removeChild(listItem);

此时，第二个列表项被成功删除。我们可以将代码放入一个删除函数中，以便重复使用。 例如，我们可以编写一个名为 deleteListItem() 的函数：

function deleteListItem() {
let listItem = document.querySelectorAll('li')[1];
listItem.parentNode.removeChild(listItem);
}

调用该函数后，第二个列表项将被删除。 删除列表项同样适用于动态添加的元素。假设我们有一个按钮，每次单击该按钮时将添加一个新的列表项。我们可以使用以下代码：

let button = document.querySelector('button');
let ul = document.querySelector('ul');
button.addEventListener('click', function() {
let li = document.createElement('li');
li.textContent = '新列表项';
ul.appendChild(li);
});

此时，每次单击按钮时将添加一个新列表项。要删除一个添加的列表项，我们可以使用与上述相似的方法。首先选择要删除的 li，然后从它的父节点中删除它。修改 deleteListItem() 函数如下：

function deleteListItem() {
let listItem = document.querySelectorAll('li')[2];
listItem.parentNode.removeChild(listItem);
}

这里选择了第三个列表项作为要删除的元素。 总结一下，JavaScript 提供了简单的方法来删除整个列表项。首先使用查询方法（如 document.querySelector() 或 document.querySelectorAll()）选择要删除的元素。然后使用 parentNode.removeChild() 方法从 DOM 中删除元素。此外，这个方法适用于动态添加的元素。