循环中clearInterval未按预期生效，删除h1内字母后文字仍留存

你的代码存在几个核心问题导致功能异常：

• 定时器ID变量removeText未加声明关键字，默认挂载为全局变量，循环过程中会被后续创建的定时器ID覆盖，最终只有最后一个定时器能被正确清除，其余定时器会持续运行。
• 当文本长度为0时，你仍在执行substr(0, length-1)也就是substr(0, -1)，部分浏览器环境下该语法会返回原字符串，导致文本长度不再变化，永远无法触发清除定时器的判断条件。
• 重复调用document.querySelectorAll查询DOM属于不必要的性能损耗。

const textElements = document.querySelectorAll(".writ-text");
// 逐个为文本元素创建独立定时器
textElements.forEach(el => {
  // 用块级作用域存储当前元素的定时器ID，避免被覆盖
  const removeTimer = setInterval(() => {
    const currentStr = el.textContent;
    // 剩余字符小于等于1时直接清空并终止定时器
    if (currentStr.length <= 1) {
      el.textContent = '';
      clearInterval(removeTimer);
      return;
    }
    // 截掉最后一位字符，slice兼容性和可读性优于substr
    el.textContent = currentStr.slice(0, -1);
  }, 1000);
});

• 采用forEach遍历DOM节点，每个节点的作用域独立，定时器ID用const声明在块级作用域内，不会出现ID覆盖问题
• 提前判断文本长度，在只剩1个字符时就直接清空内容并清除定时器，避免出现负数长度的无效操作
• 替换substr为兼容性更好的slice方法，slice(0, -1)天然表示删除最后一个字符，逻辑更直观
• 提前缓存DOM元素，不需要每次定时器触发都重新查询页面节点，运行性能更高

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