compareEndPoints() Method : Text HTML « HTML « JavaScript DHTML






compareEndPoints() Method

<HTML>
<HEAD>
<TITLE>TextRange.compareEndPoints() Method</TITLE>
<SCRIPT LANGUAGE="JavaScript">
var fixedRange
function setAndShowRangeData() {
    var selectedRange = document.selection.createRange()
    var result1 = fixedRange.compareEndPoints("StartToEnd", selectedRange)
    var result2 = fixedRange.compareEndPoints("StartToStart", selectedRange)
    var result3 = fixedRange.compareEndPoints("EndToStart", selectedRange)
    var result4 = fixedRange.compareEndPoints("EndToEnd", selectedRange)
    
    B1.innerText = result1
    compare1.innerText = getDescription(result1)
    B2.innerText = result2
    compare2.innerText = getDescription(result2)
    B3.innerText = result3
    compare3.innerText = getDescription(result3)
    B4.innerText = result4
    compare4.innerText = getDescription(result4)
}
function getDescription(comparisonValue) {
    switch (comparisonValue) {
        case -1 :
            return "comes before"
            break
        case 0 :
            return "is the same as"
            break
        case 1 :
            return "comes after"
            break
        default :
            return "vs."    
    }
}
function init() {
    fixedRange = document.body.createTextRange()
    fixedRange.moveToElementText(fixedRangeElem)
}
</SCRIPT>
</HEAD>
<BODY onLoad="init()">
<H1>TextRange.compareEndPoints() Method</H1>
<HR>
<P>Select text in the paragraph in various places relative to
the fixed text range (shown in red).</P>
<TABLE ID="results" BORDER=1 >
<TR><TH>Property</TH><TH>Returned Value</TH><TH>Fixed Range vs. Selection</TR>
<TR>
    <TD CLASS="propName">StartToEnd</TD>
    <TD CLASS="count" ID="B1">&nbsp;</TD>
    <TD CLASS="count" ID="C1">Start of Fixed 
    <SPAN ID="compare1">vs.</SPAN> End of Selection</TD>
</TR>
<TR>
    <TD CLASS="propName">StartToStart</TD>
    <TD CLASS="count" ID="B2">&nbsp;</TD>

<TD CLASS="count" ID="C2">Start of Fixed 
    <SPAN ID="compare2">vs.</SPAN> Start of Selection</TD>
</TR>
<TR>
    <TD CLASS="propName">EndToStart</TD>
    <TD CLASS="count" ID="B3">&nbsp;</TD>
    <TD CLASS="count" ID="C3">End of Fixed 
    <SPAN ID="compare3">vs.</SPAN> Start of Selection</TD>
</TR>
<TR>
    <TD CLASS="propName">EndToEnd</TD>
    <TD CLASS="count" ID="B4">&nbsp;</TD>
    <TD CLASS="count" ID="C4">End of Fixed 
    <SPAN ID="compare4">vs.</SPAN> End of Selection</TD>
</TR>
</TABLE>
<HR>
<P onMouseUp="setAndShowRangeData()">
Text, Text,Text,Text,Text,Text,Text,Text,Text,Text,<SPAN ID="fixedRangeElem">
Text,Text,Text,Text,Text,Text,Text,Text,</SPAN>, 
Text,Text,Text,Text,Text,Text,Text,Text,Text,Text,Text,Text,Text,Text,Text,Text,</P>
</BODY>
</HTML>

           
       








Related examples in the same category

1.An example of a scrolling message
2.Animating Text Styles
3.Moving Text
4.Using the TextRectangle Object Properties
5.Exploring the Bounding TextRange Properties
6. Two Search and Replace Approaches (with Undo)
7.Using the document.selection Object
8.Encipher and Decipher