使用window.find()搜索可滚动div文本后调用scrollTo滚动定位不准问题

• 滚动偏移计算错误：getBoundingClientRect()返回的是元素相对于浏览器视口的坐标，你仅减去了wrapper的offsetTop（相对于文档的固定偏移），没有叠加wrapper已经滚动过的scrollTop值，滚动次数越多误差积累越严重，最终导致定位完全错误。
• window.find()是全局搜索API，默认遍历整个页面的可选中文本，没有限制搜索范围为你指定的wrapper容器，一旦匹配到容器外的内容，就会返回完全不相关的选区坐标。

function windowFind() {
  const input = document.getElementById('input');
  const searchText = input.value.trim();
  if (!searchText) return;
  const wrapper = document.getElementById('wrapper');
  const selection = window.getSelection();

  if (window.find(searchText, false)) {
    const range = selection.getRangeAt(0);
    // 校验选区是否在wrapper内部，避免匹配到容器外内容
    if (!wrapper.contains(range.commonAncestorContainer)) {
      // 重置选区到wrapper开头，重新搜索
      const resetRange = document.createRange();
      resetRange.selectNodeContents(wrapper);
      resetRange.collapse(true);
      selection.removeAllRanges();
      selection.addRange(resetRange);
      window.find(searchText, false);
    }
    const textRect = range.getBoundingClientRect();
    const wrapperRect = wrapper.getBoundingClientRect();
    // 正确计算滚动位置：叠加已滚动偏移，抵消视口坐标影响
    const targetScrollTop = wrapper.scrollTop + textRect.top - wrapperRect.top;
    wrapper.scrollTo({ top: targetScrollTop, behavior: 'smooth' });
  }
}

• 增加选区范围校验，确保只匹配wrapper容器内的文本，避免全局搜索的干扰
• 统一用getBoundingClientRect()计算容器和选中文本的视口坐标，不受页面全局滚动影响
• 叠加wrapper.scrollTop修正滚动偏移，不会随搜索次数增加出现误差
• 增加空搜索词判断，避免无效执行逻辑

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