속성 rows

속성 rows는 테이블의 tr 행 컬렉션을 저장합니다. 테이블 자체뿐만 아니라 테이블 섹션인 tHead, tBodies, tFoot에도 적용할 수 있습니다.

구문

javascript테이블.rows;

예제

테이블의 모든 행을 순회해 봅시다:

html<table id="table">
  <tr>
    <td>1</td><td>2</td><td>3</td>
  </tr>
  <tr>
    <td>4</td><td>5</td><td>6</td>
  </tr>
  <tr>
    <td>7</td><td>8</td><td>9</td>
  </tr>
</table>

javascriptlet table = document.querySelector('#table');

for (let row of table.rows) {
  console.log(row);
}

예제

속성 rows를 사용하여 테이블의 모든 행을 순회하고, 각 행 내에서 속성 cells를 사용하여 해당 셀들을 순회해 봅시다:

html<table id="table">
  <tr>
    <td>1</td><td>2</td><td>3</td>
  </tr>
  <tr>
    <td>4</td><td>5</td><td>6</td>
  </tr>
  <tr>
    <td>7</td><td>8</td><td>9</td>
  </tr>
</table>

javascriptlet table = document.querySelector('#table');

for (let row of table.rows) {
  for (let cell of row.cells) {
    console.log(cell);
  }
}

예제

테이블의 행 개수를 알아봅시다:

html<table id="table">
  <tr>
    <td>1</td><td>2</td><td>3</td>
  </tr>
  <tr>
    <td>4</td><td>5</td><td>6</td>
  </tr>
  <tr>
    <td>7</td><td>8</td><td>9</td>
  </tr>
</table>

javascriptlet table = document.querySelector('#table');
console.log(table.rows.length);

코드 실행 결과:

javascript3

함께 보기