html - zakres wyboru - uzyskanie zakresu + węzeł początkowy + węzeł końcowy + odległość

Question

Z mojego previous question do wybrania określonego tekstu HTML, przeszedłem przez this link, aby zrozumieć zakres w łańcuchu html.

Aby wybrać określony tekst na stronie html. Musimy postępować zgodnie z tymi krokami.

Zakładana HTML: skrypt

<h4 id="entry1196"><a 
    href="http://radar.oreilly.com/archives/2007/03/call_for_a_blog_1.html" 
    class="external">Call for a Blogger's Code of Conduct</a></h4> 

<p>Tim O'Reilly calls for a Blogger Code of Conduct. His proposals are:</p> 

<ol> 
    <li>Take responsibility not just for your own words, but for the 
     comments you allow on your blog.</li> 
    <li>Label your tolerance level for abusive comments.</li> 
    <li>Consider eliminating anonymous comments.</li> 
</ol> 

Java, aby dokonać wyboru według zakresu

var range = document.createRange(); // create range 
var startPar = [the p node];   // starting parameter 
var endLi = [the second li node]; // ending parameter 
range.setStart(startPar,13);   // distance from starting parameter. 
range.setEnd(endLi,17);    // distance from ending parameter 
range.select();      // this statement will make selection 

chcę zrobić to w sposób inwertowanego. Zakładam, że wybór dokonywany jest przez użytkownika w przeglądarce (safari). Moje pytanie brzmi: w jaki sposób możemy uzyskać węzeł początkowy (ponieważ mamy tutaj "węzeł p") i węzeł końcowy (ponieważ mamy tu "drugi węzeł li") oraz zakres (jak mamy tutaj 13,17) ?

Edit: moje wysiłki (od this question)

var sel = window.getSelection(); 

    if (sel.rangeCount < 1) { 
     return; 
    } 
    var range = sel.getRangeAt(0); 
    var startNode = range.startContainer, endNode = range.endContainer; 

    // Split the start and end container text nodes, if necessary 
    if (endNode.nodeType == 3) { 
     endNode.splitText(range.endOffset); 
     range.setEnd(endNode, endNode.length); 
    } 

    if (startNode.nodeType == 3) { 
     startNode = startNode.splitText(range.startOffset); 
     range.setStart(startNode, 0); 
    } 

Ale jeszcze jestem mylić o uzyskanie jak, jeśli wybrany jest akapit pierwszy lub drugi lub trzeci, czy wybrany jest w pierwszej pozycji lub drugiej pozycji lub co ...

Answer 1

Przechowywanie wybranego zakresu jest proste. Dodaje powróci tylko pierwszy wybrany zakres (Firefox przynajmniej obsługuje wiele wyborów)

<script type="text/javascript"> 

function getSelectionRange() { 
    var sel; 
    if (window.getSelection) { 
     sel = window.getSelection(); 
     if (sel.rangeCount) { 
      return sel.getRangeAt(0); 
     } 
    } else if (document.selection) { 
     return document.selection.createRange(); 
    } 
    return null; 
} 

var range; 

</script> 
<input type="button" onclick="range = getSelectionRange();" 
    value="Store selection"> 

range będzie mieć właściwości startContainer (węzeł zawierający początek zakresu), startOffset (przesunięcie w węźle pojemnika początek : przesunięcie znaków w przypadku węzłów tekstowych i przesunięcia podrzędnego w elementach), endContainer i endOffset (równoważne zachowanie właściwości początkowych). Range jest dobrze udokumentowane przez its specification i MDC.

W języku IE range będzie zawierać TextRange, który działa zupełnie inaczej. Zamiast węzłów i przesunięć, TextRanges dotyczy znaków, słów i zdań. Witryna Microsoftu zawiera dokumentację: http://msdn.microsoft.com/en-us/library/ms533042%28VS.85%29.aspx, http://msdn.microsoft.com/en-us/library/ms535872%28VS.85%29.aspx.