当我只知道字符偏移时，如何创建范围对象？答案

【问题标题】：How do I create a range object when I know just the character offsets?当我只知道字符偏移时，如何创建范围对象？
【发布时间】：2011-10-19 15:08:36
【问题描述】：

所以我有一个包含文本块的 div，之前用户在这个块中选择了一些文本，我从这个选择中创建了一个范围对象。我存储了所选文本的起点和终点的偏移量，但我在重新创建范围时遇到了问题（所以我可以操纵它）。 "quotables" 是包含所有文本的 div。我不知道我做错了什么。



    var theRange = rangy.createRange();
    var node = $('.quotables').html();
    theRange.setStart(node, 14);
    theRange.setEnd(node, 318);

但我不断收到错误：未捕获的错误：NOT_FOUND_ERR：DOM 异常 8
m.setStart
（匿名函数）
d.extend._Deferred.f.resolveWith
d.d.extend.ready
d.c.addEventListener.y

【问题讨论】：

你有没有找到解决这个问题的好方法？我正在尝试递归迭代文本节点并计算字符数，我觉得我快到了……

标签： javascript html dom range rangy

【解决方案1】：

范围边界不是 HTML 字符串表示中的字符偏移量。相反，它是 DOM 节点内的偏移量。例如，如果节点是文本节点，则边界表示为节点文本内的字符偏移量。如果节点是元素，则表示为边界之前节点的子节点数。例如，在以下 HTML 中，其边界由 | 表示：

<div id="test">foo|bar<br>|<br></div>

... 范围的起始边界位于作为<div> 元素的第一个子节点的文本节点中的偏移量3，而结束边界位于<div> 内的偏移量2，因为有两个子节点（文本节点“foobar”和一个<br> 元素）位于边界之前。您可以按如下方式以编程方式创建范围：

var range = rangy.createRange(); // document.createRange() if not using Rangy
var div = document.getElementById("test");
range.setStart(div.firstChild, 3);
range.setEnd(div, 2);

【讨论】：

在给定文本字符串表示中的字符偏移量的情况下，有没有办法以编程方式“找出”您需要的起始节点和结束节点以及相对偏移量？