/*
JavaScript Bible, Fourth Edition
by Danny Goodman
Publisher: John Wiley & Sons CopyRight 2001
ISBN: 0764533428
*/
<HTML>
<HEAD>
<TITLE>TextRange.compareEndPoints() Method</TITLE>
<STYLE TYPE="text/css">
TD {text-align:center}
.propName {font-family:Courier, monospace}
#fixedRangeElem {color:red; font-weight:bold}
</STYLE>
<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). See the relations between
the fixed and selected ranges with respect to their start
and end points.</P>
<TABLE ID="results" BORDER=1 CELLSPACING=2 CELLPADDING=2>
<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"> </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"> </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"> </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"> </TD>
<TD CLASS="count" ID="C4">End of Fixed
<SPAN ID="compare4">vs.</SPAN> End of Selection</TD>
</TR>
</TABLE>
<HR>
<P onMouseUp="setAndShowRangeData()">
Lorem ipsum dolor sit, <SPAN ID="fixedRangeElem">consectetaur adipisicing
elit</SPAN>,
sed do eiusmod tempor incididunt ut labore et dolore aliqua. Ut enim adminim
veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat.</P>
</BODY>
</HTML>
|