你的搜索函数存在几个关键问题，导致结果不稳定和布局混乱，我来帮你拆解并修复：

原代码的核心bug分析： #

• 错误遍历所有<td>元素：你直接操作表格里的所有单元格，这会导致非名称列的单元格也被隐藏，彻底打乱表格布局；而且循环上限IDInc和实际<td>数量不匹配（比如每行有多列的话，td总数是行数×列数），会出现循环越界或者漏处理的情况。
• 未声明的全局变量：td、txtValue没有用let/const声明，会意外成为全局变量，很容易和其他代码产生冲突。
• 只控制单个单元格显示：应该控制整行的显示/隐藏，而不是单个单元格，否则表格的结构会变得支离破碎。

修复后的完整代码 #

function Search_Name() {
  // 安全声明所有局部变量，避免全局污染
  let input = document.getElementById("Name");
  let filter = input.value.trim().toUpperCase(); // 用trim处理输入前后的无效空格
  let table = document.getElementById("Entries");
  let rows = table.getElementsByTagName("tr"); // 遍历表格行而非单个单元格

  // 遍历所有表格行（如果有表头，可从i=1开始跳过表头）
  for (let i = 0; i < rows.length; i++) {
    // 假设名称在每行的第一个<td>，可根据你的表格结构调整索引
    let nameCell = rows[i].getElementsByTagName("td")[0];
    if (nameCell) {
      // 兼容不同浏览器的文本获取方式
      let txtValue = nameCell.innerText || nameCell.textContent;
      let isMatch = txtValue.toUpperCase().indexOf(filter) > -1;
      // 控制整行的显示状态，保证表格结构完整
      rows[i].style.display = isMatch ? "" : "none";
    }
  }
}

关键改进点说明： #

• 操作表格行而非单元格：通过控制<tr>的显示状态，确保表格布局不会被破坏。
• 变量安全声明：所有局部变量用let声明，避免全局变量冲突引发的隐性bug。
• 浏览器兼容处理：同时使用innerText和textContent，适配不同浏览器的文本读取逻辑。
• 空输入处理：trim()可以过滤输入前后的空格，当输入为空时会自动显示所有行。
• 灵活适配表格结构：如果名称不在第一列，只需要调整getElementsByTagName("td")[0]里的索引值即可。

额外优化建议 #

如果你的表格包含表头（<th>元素），可以修改循环起始索引跳过表头行：

// 从i=1开始遍历，跳过第一行表头
for (let i = 1; i < rows.length; i++) {
  // ... 其余逻辑保持不变
}

内容的提问来源于stack exchange，提问作者user199135