table] div 내 table 표시내용 번호추출...

참고 : - table] javascript 내부변수 검색을 위한 전진... - http://killofki.egloos.com/5326330

일단 div 를 만들고, 그 안에 table 을 넣은 후,
div 를 초기(?) 스크롤시켜서 부분을 보여준 뒤,

해당 부분이 table 의 몇번째줄인지 보여주게할 예정이다.

...

<script>

function trOffsetTop(trObj) {
  return trObj.offsetTop+(trObj.offsetParent.tagName=='TABLE'?0:trObj.offsetParent.offsetTop)
  }

function TRShow(divObj, tableObj) {
  var
    divScrollTop, divScrollBottom,
    tableTop, tableBottom,
    TRshowi, outv='';

  divScrollTop = divObj.scrollTop;
  divScrollBottom = divScrollTop + divObj.offsetHeight;

  with(tableObj) for (TRshowi=0; TRshowi<rows.length; TRshowi++)
    if ((trOffsetTop(rows[TRshowi])+rows[TRshowi].offsetHeight)>=divScrollTop) break;
  tableTop=TRshowi;

  with(tableObj) for (;TRshowi<rows.length; TRshowi++)
    if (trOffsetTop(rows[TRshowi])>divScrollBottom) break;
  tableBottom=TRshowi;

  with(tableObj) for (TRshowi=tableTop; TRshowi<tableBottom; TRshowi++)
    outv+=TRshowi+':'+rows[TRshowi].cells[0].innerHTML+' ';

  return outv;
  }

</script>

<div id=DIV100529_1 style="width:100px; height:100px; overflow:auto; background-color:#dddddd;" onscroll="divtableStatus();" >
<script>

var SList='ABCDEFGHIJKLMN', i;

document.write('<table id=TABLE100529_1>');

for (i=0; i<SList.length; i++)
  document.write('<tr height=20><td>'+SList.charAt(i)+'</td></tr>');
document.write('</table>');

</script>
</div>

<div id=DIV100529_2></div>

<script>

function divtableStatus() {
  with(document)
    getElementById('DIV100529_2').innerHTML=
      TRShow(getElementById('DIV100529_1'),getElementById('TABLE100529_1'));
  }

</script>

<script>
document.getElementById('DIV100529_1').scrollTop=90;
divtableStatus();
</script>

 

...

...

음... 기본원리는
div 의 scroll 이 표시되는 범위를 divScrollTop 과 divScrollBottom 에 저장한 후,

table 에서 보이는 tr 이 div 의 표시범위 내에 있는지 확인하기 위해

tr 의 바닥이 divScrollTop 보다 작으면 넘어가고, 크면 그 부분부터 표시하고,
(처음처럼 보이는 TR 의 바닥)
tr 의 천정(?)이 divScrollBottom 보다 작으면 넘어가고, 크면 그 부분부터는 표시하지 않는다.
(마지막처럼 보이는 TR 의 천정)

...

그 외에... tr 의 offsetTop 의 위치가 tbody, thead 에 영향을 받는지 몰라서,
급한대로(?) offsetParent.tagName 을 불러서 썼다...

...

직접/초기 스크롤 할 때 onscroll 이 작동하지 않을까봐 강제스크롤한 이후 한번 더 넣어는 봤다.
= =;... 버튼으로 적용해둘 껄 그랬나...

...

NowMark killofki@.