테이블 행 컬렉션
예시
테이블에 몇 개의 행이 있는지 알아보십시오.
var x = document.getElementById("myTable").rows.length;
x 의 결과 는 다음과 같습니다.
2
아래에서 더 많은 "직접 사용해 보기" 예를 살펴보세요.
정의 및 사용
행 컬렉션은 테이블의 모든 <tr> 요소 컬렉션을 반환합니다.
참고: 컬렉션의 요소는 소스 코드에 나타나는 대로 정렬됩니다.
팁: insertRow() 메서드를 사용 하여 새 행(<tr>)을 만듭니다.
팁: deleteRow() 메소드를 사용 하여 행을 제거하십시오.
팁: insertCell() 메서드를 사용 하여 새 셀(<td>)을 만듭니다.
팁: deleteCell() 메서드를 사용하여 셀을 삭제합니다 .
팁: 셀 컬렉션을 사용하여 테이블의 모든 <td> 또는 <th> 요소 컬렉션을 반환합니다.
브라우저 지원
Collection | |||||
---|---|---|---|---|---|
rows | Yes | Yes | Yes | Yes | Yes |
통사론
tableObject.rows
속성
Property | Description |
---|---|
length | Returns the number of <tr> elements in the collection. Note: This property is read-only |
행동 양식
Method | Description |
---|---|
[index] | Returns the <tr> element from the collection with the specified index (starts at 0). Note: Returns null if the index number is out of range |
item(index) | Returns the <tr> element from the collection with the specified index (starts at 0). Note: Returns null if the index number is out of range |
namedItem(id) | Returns the <tr> element from the collection with the specified id. Note: Returns null if the id does not exist |
기술적 세부 사항
DOM 버전: | 핵심 수준 2 문서 개체 |
---|---|
반환 값: | <table> 요소의 모든 <tr> 요소를 나타내는 HTMLCollection 개체입니다. 컬렉션의 요소는 소스 코드에 나타나는 대로 정렬됩니다. |
더 많은 예
예시
[ 인덱스 ]
테이블에서 첫 번째 <tr> 요소(인덱스 0)의 innerHTML을 경고합니다.
alert(document.getElementById("myTable").rows[0].innerHTML;
예시
항목( 인덱스 )
테이블에서 첫 번째 <tr> 요소(인덱스 0)의 innerHTML을 경고합니다.
alert(document.getElementById("myTable").rows.item(0).innerHTML);
예시
명명된 항목( 아이디 )
테이블에서 id="myRow"인 <tr> 요소의 innerHTML을 경고합니다.
alert(document.getElementById("myTable").rows.namedItem("myRow").innerHTML);
예시
첫 번째 표 셀의 내용을 변경합니다.
var x = document.getElementById("myTable").rows[0].cells;
x[0].innerHTML = "NEW CONTENT";
관련 페이지
HTML 참조: HTML <tr> 태그
JavaScript 참조: HTML DOM TableRow 개체
❮ 테이블 개체