欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

TextRange 對(duì)象 TFOOT 元素 | tFoot 對(duì)象 DHTML 對(duì)象

TextRectangle 對(duì)象

指定包含元素或 TextRange 對(duì)象中一行文本的矩形。

成員表

屬性描述
bottom 設(shè)置或獲取圍繞對(duì)象內(nèi)容的矩形上邊坐標(biāo)。
left 設(shè)置或獲取圍繞對(duì)象內(nèi)容的矩形左邊坐標(biāo)。
right 設(shè)置或獲取圍繞對(duì)象內(nèi)容的矩形右邊坐標(biāo)。
top 設(shè)置或獲取圍繞對(duì)象內(nèi)容的矩形下邊坐標(biāo)。

注釋

對(duì)一個(gè)元素或文本范圍對(duì)象應(yīng)用 getClientRects 方法可以獲得一個(gè) TextRectangle 對(duì)象的集合。getClientRects 方法返回一個(gè)矩形的集合，其中包括每個(gè)矩形相對(duì)于客戶區(qū)的上、下、左、右的坐標(biāo)。

在下面取自徐志摩《再別康橋》的詩(shī)句中，b 元素(粗體文本)中共包含四個(gè) TextRectangle 對(duì)象。

<P>悄悄的<B>我走了，<BR>
正如我悄悄的來；<BR>
我揮一揮衣袖，<BR>
不帶走</B>一片云彩。
</P>

這四個(gè) TextRectangle 對(duì)象是:

  1. “我走了，”
  2. “正如我悄悄的來；”
  3. “我揮一揮衣袖，”
  4. “不帶走”

如果你更改包含此文本的窗口的大小，TextRectangle 對(duì)象不會(huì)更新。由于對(duì)象是布局的快照，應(yīng)該在 onresize 事件觸發(fā)后隨之更新對(duì)象。

TextRectangle 的寬度可能與其包含的 TextRange 的寬度并不相等。因?yàn)?TextRange 與文本的寬度相等，而 TextRectangle 卻與包含文本的元素寬度相等。

此對(duì)象在 Microsoft® Internet Explorer 5 的腳本中可用。

示例

下面的例子演示了如何使用 getClientRects 和 getBoundingClientRect 方法突出顯示對(duì)象中的文本行。

<HEAD>
<SCRIPT>
var rcts;
var keyCount=0;
function Highlight(obj) {
rcts = obj.getClientRects();
rctLength= rcts.length;
if (keyCount > rctLength-1) {
idBeige.style.display="none";
keyCount = 0
}
// 設(shè)置黃色 DIV 的渲染屬性
cdRight = rcts[keyCount].right + idBody.scrollLeft;
cdLeft = rcts[keyCount].left + idBody.scrollLeft;
cdTop = rcts[keyCount].top + idBody.scrollTop;
cdBottom = rcts[keyCount].bottom + idBody.scrollTop;
idYellow.style.top = cdTop;
idYellow.style.width = (cdRight-cdLeft) - 5;
idYellow.style.display = 'inline';
// 設(shè)置土色 DIV 的渲染屬性
bndRight = obj.getBoundingClientRect().right +
idBody.scrollLeft;
bndLeft = obj.getBoundingClientRect().left +
idBody.scrollLeft;
bndTop = obj.getBoundingClientRect().top +
idBody.scrollTop;
idBeige.style.top = bndTop;
idBeige.style.width = (bndRight-bndLeft) - 5;
idBeige.style.height = cdTop - bndTop;
if (keyCount>0){
idBeige.style.display = 'inline';
}
keyCount++;
}
</SCRIPT>
</HEAD>
<BODY ID="idBody">
<DIV ID="oID_1" onclick="Highlight(this)"
onkeydown="Highlight(this)">
在此會(huì)有大量的文本。如果多次單擊此處的文本，
將會(huì)看到每單擊一次鼠標(biāo)，就會(huì)有一行被突出顯示。
如果每行都被突出顯示了，這個(gè)過程就會(huì)從第一行
重新開始。
</DIV>
<DIV STYLE="position:absolute; left:5; top:400;
z-index:-1; background-color:yellow; display:none"
ID="idYellow"></DIV>
<DIV STYLE="position:absolute; left:5; top:400;
z-index:-1; background-color:beige; display:none"
ID="idBeige"></DIV>
</BODY>
此特性需要 Microsoft® Internet Explorer 5.0 或以后版本。請(qǐng)單擊下面的圖標(biāo)安裝最新版本。然后重新裝入此頁(yè)再查看示例。

下面的例子是用了 TextRectangle 集合和 getClientRects 及 getBoundingClientRect 方法決定元素中文本矩形的位置。在行中左對(duì)齊的文本并不擴(kuò)展到包含文本的外框的右邊。使用此集合，你可以確定僅僅圍繞在每行內(nèi)容外側(cè)的矩形的坐標(biāo)。示例代碼將讀取這些矩形的坐標(biāo)并演示一個(gè)小球只在文本處劃過，而不是行尾。

<HEAD>
<SCRIPT>
var timid = -1;
var timoID_2 = -1;
var nLine;
var nPosInLine;
var oRcts;
var nDivLen;
var nEraser;
function LoadDone() {
oTextRange = document.body.createTextRange();
// 獲得范圍的綁定矩形
oRcts = oTextRange.getClientRects();
nLine = 0;
oBndRct = obj.getBoundingClientRect();
nDivLen = oBndRct.right - oBndRct.left + 1;
MoveTo();
}
function MoveTo() {
if (nLine >= oRcts.length) {
nLine = 0;
}
obj.style.top = oRcts[nLine].top;
nPosInLine = oRcts[nLine].left;
nEraser = 0;
timoID_2 = setInterval("MoveToInLine()",60);
}
function MoveToInLine() {
if (nPosInLine >= oRcts[nLine].right - nDivLen) {
clearInterval(timoID_2);
timoID_2 = -1;
obj.style.left = oRcts[nLine].right - nDivLen;
nLine++;
timid = setTimeout("MoveTo()", 100);
return;
}
if (nEraser == 0) {
nEraser = 1;
}
else {
nEraser = 0;
}
im.src = "/workshop/graphics/dot.gif";
obj.style.left = nPosInLine;
nPosInLine += 3;
}
function End() {
if(timid != -1) {
clearInterval(timid);
timid = -1;
}
if(timoID_2 != -1) {
clearInterval(timoID_2);
timoID_2 = -1;
}
}
</SCRIPT>
</HEAD>
<BODY ID="bodyid" onload="LoadDone()"
onresize="End();LoadDone();" onunload="End()">
<P STYLE="text-align:center">
<B>The quick brown fox jumps over the lazy dog.</B>
</P>
<DIV ID="obj" STYLE="position:absolute">
<IMG ID="im" SRC="/workshop/graphics/dot.gif"
BORDER=0 HEIGHT=16 WIDTH=16>
</DIV>
</BODY>
此特性需要 Microsoft® Internet Explorer 5.0 或以后版本。請(qǐng)單擊下面的圖標(biāo)安裝最新版本。然后重新裝入此頁(yè)再查看示例。

標(biāo)準(zhǔn)信息

此對(duì)象定義在 HTML 3.2 非 Microsoft 鏈接 中。