Geek asks and answers

Get offset offset relative to specific node parent

I would like to know the position (also known as: offset, index) of the user's choice of text (selected) on a web page relative to a specific parent node.

I use Rangy to try to help me, but it has no built-in offset properties. API Here is what I still have:

function GetSelectionIndexRelativeTo(parentNodeId) 
{
    var parentNode = document.getElementById(parentNodeId);

    var txt = rangy.getSelection().toString();
    var code = rangy.getSelection().toHtml();
    var len = code.length;

    var x1 =         ;       // THIS IS WHAT I REALLY WANT. WHAT DO I DO?
    var x2 = x1 + len;

    return {
        text: txt,
        html: code,
        start: x1,
        end: x2,
        length: len
    }
}

To give a few examples:

PAGETEXT:      <poem><title>Galaxy</title>Twinkle Twinkle Little Star</poem>

1. SELECTION:  Galaxy
   RELATIVETO: title
   RESULT:     start = 0

2. SELECTION:  Star
   RELATIVETO: poem
   RESULT:     start = 43

3. SELECTION:  Twinkle (the second one)
   RELATIVETO: poem
   RESULT:     start = 28
+3
source share
1 answer

In response to my comment, you indicated that this is the goal:

I want users to be able to select specific words in a poem and add annotations. I want to save each annotation as a tuple.

, . , . , .

Rangy

. , - . , DOM , , Rangy. , , , , . , , .

, . ( .)

Rangy Serializer Module

. , , , DOM.

, DOM, , . DOM , . ( .)

:

<poem><title>Galaxy</title>Twinkle Twinkle Little Star</poem>

, . - , , , . , , :

<poem><title>Galaxy</title><author>John Doe</author>Twinkle Twinkle Little Star</poem>

, .

, , , . :

rangy.serializeSelection(sel, false, root)

sel. false, , , DOM . root , .

, . , . , poem, . , poem.

, , , , :

<poem><title>Galaxy</title>Twinkle Twinkle <ann-start ann="#ANN.1"/>Little Star<ann-end ann="#ANN.1"/></poem>
<ann id="ANN.1" creator="Bob">In private correspondence, the author referred to his daughter as his "Little Star"</ann>

( XML . -.)

<ann-start> <ann-end> , , XML ( HTML) straddle. ann - , , ann-start ann-end.

, , . :

<poem><title>Galaxy</title><author>John Doe</author>Twinkle Twinkle <ann-start ann="#ANN.1"/>Little Star<ann-end ann="#ANN.1"/></poem>
<ann id="ANN.1" creator="Bob">In private correspondence, the author referred to his daughter as his "Little Star"</ann>

, .

, ?

. :

PAGETEXT:      <poem><title>Galaxy</title>Twinkle Twinkle Little Star</poem>

3. SELECTION:  Twinkle (the second one)
   RELATIVETO: poem
   RESULT:     start = 28

28 , :

  • , .

  • . , , .

  • . , :

    <poem><title id="...">Galaxy</title>Twinkle Twinkle Little Star</poem>

id, . , ( ), ( , ).

+4

More articles:


All Articles