给定提取的组合文本字符串中的偏移量，如何确定包含节点和偏移量

Given an offset in an extracted combined text string, how to determine containing node and offset?

本文关键字：偏移量 何确定 包含 节点 提取 组合 文本 字符串      更新时间：2023-09-26

给定以下HTML(只是一个示例):

<div id="container"><span>This is <strong>SOME</strong> great example, <span style="color: #f00">Fred!</span></span></div>

可以使用jQuery的text()函数提取文本:

var text = $('container').text();

现在，确定提取文本中的偏移量10对应于上面示例中<strong>SOME</strong>节点中的文本节点的偏移量2的最简单，最快，最优雅的方法是什么?此外，如何做反向，即确定从<strong> DOM对象中提取的文本中的偏移量10和偏移量2 ?

从这里开始。你可以使用TreeWalker得到一个非常优雅的解决方案。你需要为IE实现TreeWalker(假设你需要IE支持)。

function findOffset(node, initialOffset) {
  var offset = initialOffset;
  var walker = node.ownerDocument.createTreeWalker(node, NodeFilter.SHOW_TEXT);
  while(walker.nextNode()) {
    var text  = walker.currentNode.nodeValue;
    if (text.length > offset) {
      return { node: walker.currentNode.parentNode, offset: offset };
    }
    offset -= text.length;
  }
  return { node: node, offset: initialOffset };
}

演示

相关文章：