TextRange对象的setEndPoint方法和compareEndPoints方法
Code<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文</title>
</head>
<body onload="PointsExplane();">
<SCRIPT language=javascript>
function PointsExplane()
{
//在这里主要介绍下TextRange对象的setEndPoint方法和compareEndPoints方法
//先介绍setEndPoint("[way]",oRange)方法：将当前范围的开始或结束点移动到oRange范围的开
//始或者结束点
//该方法有两个参数:[way]表示将当前范围以何种方式移动到oRange范围，有四种方式：
//StartToStart将当前开始位置移动到oRange的开始位置，
//StartToEnd将当前范围开始位置移动到oRange的结束位置，EndToStart将当前结束位置移动到
//oRange的开始位置，EndToEnd将当前范围的结束位置
//移动到oRange的结束位置，oRange该对象也是TextRange，oRange的开始和结束位置代表要移动到
//的目标位置
//注意当前范围必须和oRange范围来自同一对象（范围），比如页面上现在有两个input show1和
//show2
//如果你这样写:
//例1：
var r1=document.all("show1").createTextRange();
var r2=document.all("show2").createTextRange();
r1.setEndPoint("StartToEnd",r2);
//会提示错误："目标参数无效！",即r2无效，为什么呢？下面请再看一个例子你应该就明白了：
//例2：
r1=document.all("show1").createTextRange();
document.all("show1").focus();//表示让show1获得焦点，光标在show1开始处
r2=document.selection.createRange();//由于shw1获得了焦点，document.selection相当于
//就是光标的范围,document.selection.createRange()就是长度为0的TextRange
r2.setEndPoint("EndToEnd",r1)
alert(r2.text);
//结果是1234567890，很显然这是把一个小范围变成一个大范围了，言下之意就相当TextRange实际
//上是一个尺子，r1和r2相当于是两个开始和结束位置不同
//且长度不同的两把尺子，但是setEndPoint方法要求这两把尺子量的是一个物体才行，所以你发现第
//二个例子r1和r2虽然是两个TextRange但是他们都来自
//show1这个HTML对象，所以说：当前范围必须和oRange范围来自同一对象（范围）！
//补充：
r2.moveEnd("character",-3);//将结束点向前移动三个位置(每个位置就是一个字符)
r2.setEndPoint("StartToEnd",r1)
alert(r2.text);
//上面这个例子输出：890，说明开始和结束点是相对的，随时可以互换，在前面的就叫开始点后面的
//就叫结束点，像上面的补充例子就把
//开始点换到结束点后面去了，结束点变成了开始点，开始点变成了结束点！
//相信经过上面的例子后你对setEndPoint已经了解了吧
//现在再来说说compareEndPoints("[way]",oRange)方法：表示比较当前范围的开始或结束点是在
//oRange范围开始或结束点的左边还是右边
//这个方法也要注意当前范围必须和oRange范围来自同一对象（范围），因为左右都是相对于同一对象
//而言的，看个例子你就明白了：
//例3：
r1=document.all("show1").createTextRange();
r2=document.all("show1").createTextRange();
r2.moveStart("character",3);//这句之后r2的范围是4567890,r1还是1234567890
alert(r1.compareEndPoints("StartToEnd",r1));//结果-1，表示r1开始点在r2结束点左边
alert(r1.compareEndPoints("EndToEnd",r1));//结果0，表示r1结束点和r2结束点在同一位置
alert(r1.compareEndPoints("EndToStart",r1));//结果1，表示r1结束点在r2开始点右边
alert(r1.compareEndPoints("StartToStart",r1));//结果-1，表示r1开始点在r2开始点的左
//边位置
//现在知道为什么compareEndPoints要当前范围必须和oRange范围来自同一对象（范围）吧，其实这
//个方法可以看成是两个不同长度的尺子在量同一个物体，但是两把尺子的开始点和结束点可能在这个
//物体不同位置上，现在就是要找出他们的前后顺序（左右）。
//这个方法的参数[way]表示比较的是开始点还是结束点，这里既不多说了上面的例3已经说明[Way]的
//含义了，compareEndPoints返回的结果是数字：-1表示在当前范围边界点在oRange边界点的左
//边，0表示当前范围边界点和oRange边界点在同一位置上，1表示当前范围边界点在oRange边界点的
//右边
}
</SCRIPT>
<input id="show1" name="show1" type="text" value="1234567890" />
<input id="show2" name="show2" type="text" value="456789" />
</body>
</html>
浙公网安备 33010602011771号