getClientRects 메서드에 의하여 반환된 TextRectangle 개체들의 컬렉션이다.

인수
: (개체)
필수적인 요소이고 컬렉션을 포함하는 모체 개체이다.

cVal : (컬렉션)
값은 선택적인 요소이고 컬렉션을 나타내는 개체이다.

oVal : (개체)
값은 선택적인 요소이고 컬렉션의 한개의 엘레멘트 개체이다.

index : (정수)
값은 필수적인 요소이고 컬렉션의 인수로 한개의 엘레멘트 개체를 참조할수 있고 배열변수의 규칙에따라 0부터 시작하고 제일 마지막 인수는 길이보다 1 작다.

특기

텍스트를 가지지 않는 개체들에서는 빈 컬렉선을 반환한다.

이 텍스트가 포함되어 있는 윈도우의 크기가 조절되더라도 TextRectangle 개체들은 업데이트되지 않는다.
이 개체들은 한 싯점에 포착한 것으로 업데이트하려면 onresize 이벤트가 발생되면 업데이트해야 한다.

참조
TextRectangle createTextRange

설명을 위한 예제


length 속성 IE
⇒ 컬렉션의 길이를 반환한다.
문법: [iVal=].length
코드: document.write(oObj.length); 결과:

item 메서드 IE
⇒ 인덱스로 컬렉션의 한개의 개체를 반환한다.
문법: [oVal=].item(index)
코드: document.write(oObj.item(0).top+' | '+oObj.item(0).left) 결과:
namedItem 메서드 IE6
⇒ id이나 name으로 컬렉션의 한개의 개체를 반환한다.
문법: [oVal=].namedItem(sVal)
코드: document.write(oObj.namedItem('TRObj'))

getClientRects 메서드로 속성 보는 예제

결과 표시창
<SCRIPT>
function showRects(obj){
  cRects=obj.getClientRects();
  colLn=cRects.length
  str='';
  for (i=0;i< colLn;i++){	
    str+=(i+1)+'번 TextRectangle<UL>';
    str+='<LI>cRects('+i+').top='+cRects(i).top+' pixel.';
    str+='<LI>cRects('+i+').bottom='+cRects(i).bottom+' pixel.';
    str+='<LI>높이 (cRects('+i+').bottom-cRects('+i+').top)='+(cRects(i).bottom-cRects(i).top)+' pixel.';
    str+='<LI>cRects('+i+').right='+cRects(i).right+' pixel.';
    str+='<LI>cRects('+i+').left='+cRects(i).left+' pixel.';
    str+='<LI>너비 (cRects('+i+').right-cRects('+i+').left)='+(cRects(i).right-cRects(i).left)+' pixel.</UL>';
  }
  showA.innerHTML=str;
}
</SCRIPT>
<BUTTON onclick=showRects(document.body.createTextRange()))>TextRectangles 보기 클릭</BUTTON>
<DIV id=showA style=width:400;height:9em>결과 표시창</DIV>