javascript - Javascript - 选择 - 识别文本节点

Question

我正在使用 Javascript 选择方法，并且即使在刷新页面后也希望保存用户的选择。我为页面上的每个html 元素添加了一个唯一的 id。用户选择后，我保存 anchorNode id、focusNode 和偏移量。然后我想使用 Range 和 Selection 类恢复选择。问题是：例如，如果有

<div id="u1">hello <i id="u2">italic</i> word!</div>

并且用户选择llo italic wor，anchorOffset 将为 2，focusOffset 将为 3，因为我们在 div 内有 3 个文本节点。那么，如何确定文本节点呢？我将拥有 u1 id（父 id），但如何知道偏移量属于哪个文本节点？谢谢。

Answer 1

如果父 div 中的文本节点 selectedText - Selection 类的实例，我们可以确定位置

 var selectedStartNodeText = selectedText.anchorNode.textContent;
 var startTextNodeId = 0;
 $.each(selectedText.anchorNode.parentNode.childNodes, function(i, n){
        if(n.textContent == selectedStartNodeText) {
                startTextNodeId = i;
        }
 });

Answer 2

您可以使用我的Rangy库中的Serializer 模块，或者它使用的方法，文档中对此进行了说明。它看起来有点像XPath。