如何通过Javascript在句子中获得选定的字符串偏移量开始和偏移量结尾

Question

我有两个副本，一个是HTML版本，如下所示。

<div class="data-sentence" onclick="setSentenceNo(28);"> 
    <p> 
    Statement of Advice for <span class="artemis_soa ano-subject" data-oristr="Joe" data-replaceid="tag_replace_6" data-hasqtip="7">&lt;NAME_1&gt;</span> and <span class="artemis_soa ano-subject" data-oristr="Black" data-replaceid="tag_replace_3" data-hasqtip="8">&lt;NAME_2&gt;</span>, 
    </p> 
</div> 

另一个是像下面这样的纯文本（也可以说它是用户在浏览器中可以看到的）。

Statement of Advice for <NAME_1> and <NAME_2>, 

所以我想要的是允许用户选择字符串并返回所选字符串用户的偏移量开始和偏移量结束。 （我们也不应该让用户选择保留的标签）。

例如，用户选择字符串 '建议' 中，offset_start = 13和offset_end = 19

我很欣赏你的帮助。

Answer 1

使用window.getSelection()然后Selection和Range API来获得您需要的偏移量。

document.body.onmouseup = function() { 
 
    var selection = window.getSelection(); 
 
    var range = selection.getRangeAt(0); 
 
    console.log(range.startOffset, range.endOffset); 
 
};

<div><p>Statement of Advice for <span>&lt;NAME_1&gt;</span> and <span>&lt;NAME_2&gt;</span>,</p></div>