我一直在尝试找出如何删除特定的“li”标签，方法是根据其在列表中的位置输入其编号（即在文本框中输入 3，然后按按钮删除列表位置 3 中的项目） ）。现在我的代码是这样的，即使只列出了 4 个项目，输入 5 并按 Enter 键仍然会删除 2 个项目，而不是不删除任何项目。我的代码编写方式与删除特定“li”标签时键入的数字不一致。任何帮助将不胜感激，谢谢。<html><head><title>Chapter 5 Activity</title></head><body><h1>The Best Fruit in the World</h1><ol id="fruit"> <li>Mangos</li> <li>Watermelons</li> <li>Kiwis</li> <li>Pineapples</li></ol><form action=""><input type="text" name="rfruit" id="fruitremove"> <input type="button" value="Click to Remove" onclick="removefruit()"> Remove fruit you dislike</form><script type="text/javascript">function removefruit(){ var fruitminus = document.getElementById("fruitremove").value; var flist = document.getElementById("fruit"); flist.removeChild(flist.childNodes[fruitminus]);}</script></body></html>
1 回答
慕尼黑8549860
TA贡献1818条经验 获得超11个赞
出现问题是因为在您的情况下为您创建的 NodeList 的flist长度为 8。这是因为每个列表元素创建 2 个元素（一个是文本，一个是 li）。因此，只需在删除子节点之前添加一个 if 条件，如下所示：
if(fruitminus < (flist.childNodes.length)/2) flist.removeChild(flist.childNodes[2*fruitminus - 1]);
li 的索引出现在 NodeList 中的奇数位置，这就是为什么我们需要删除该位置的 childNode。
添加回答
举报
0/150
提交
取消