Javascript 函数第一次未获取所有值

Question

我试图让用户上传一个项目列表来过滤搜索结果表。问题是，并非所有在过滤器列表中没有值的行都会在第一次被删除，因此为了让程序执行我想要的操作，我需要多次运行它。

附加的代码可以工作，但我想删除“badWorkAround()”函数

<div align="center">
<script>
  function readList() {
  var origText = document.getElementById("CusipTextArea").value;
  var filterList = origText.split("\n");
  var table = document.getElementById("resultsTable");
  var rows = table.getElementsByTagName("tr"); 
  for(i = 1; i < rows.length; i++)  #first row has the column names so I start at i=1
 { 
   var Found = '0'
   for(j = 0; j < filterList.length; j++)
    {   
        if (rows[i].innerHTML.indexOf(filterList[j]) > 0){
        Found = '1'
        break;
            } 
        } 
    if (Found != '1'){rows[i].remove();}    
     } 
  }
  function badWorkAround(){
        readList();
        readList();
        readList();
        readList();
        readList();
        readList();
        readList();
        readList();
        readList();
  }
</script>
<textarea id=TextArea>Paste in a list to filter by. One per line please.</textarea><BR>
<button type="button" onclick="return badWorkAround();">Filter by List</button>
</div>

Answer 1

NodeList(就像使用 getElementsByTagName 获得的)是“实时”的，这意味着它们随时反射(reflect) DOM 的当前状态。

您正在循环 TR 节点，然后在执行此操作时删除其中一些节点。假设您位于循环中的索引 1(第二次循环迭代)，并删除该节点 - 所有后续节点“向上滑动”一个位置，因此以前索引为 2 的节点现在索引为 1，而原来的节点为索引 1。 3 现在是 2，等等。但是，由于您还在每个循环中将循环计数器 i 增加 1，因此在下一次迭代中，您访问的节点现在是索引 2(以前为 3)——并且之前位于位置 2 的节点甚至不再被处理。

此问题的最简单解决方案:向后循环节点，从 rows.length - 1 到 0(并且减少显然，你的循环计数器变量)。因为如果删除列表末尾的节点，不会影响其之前任何节点的位置。