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>
<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>