테이블 insertRow() 메서드
예시
테이블의 첫 번째 위치에 새 행을 삽입하고 일부 내용이 포함된 <td> 요소를 삽입합니다.
// Find a <table> element with id="myTable":
var table = document.getElementById("myTable");
// Create an empty <tr> element and add it to the 1st position of the table:
var row = table.insertRow(0);
// Insert new cells (<td> elements) at the 1st and 2nd position of the "new" <tr> element:
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
// Add some text to the new cells:
cell1.innerHTML = "NEW CELL1";
cell2.innerHTML = "NEW CELL2";
정의 및 사용
insertRow() 메서드는 빈 <tr> 요소를 만들어 테이블에 추가합니다.
insertRow() 메서드는 테이블의 지정된 인덱스에 새 행을 삽입합니다.
참고: <tr> 요소는 하나 이상의 <th> 또는 <td> 요소를 포함해야 합니다.
팁: deleteRow() 메소드를 사용 하여 행을 제거하십시오.
브라우저 지원
Method | |||||
---|---|---|---|---|---|
insertRow() | Yes | Yes | Yes | Yes | Yes |
통사론
tableObject.insertRow(index)
매개변수 값
Value | Description |
---|---|
index | Required in Firefox and Opera, optional in IE, Chrome and Safari. A number that specifies the position of the row to insert (starts at 0). The value of 0 results in that the new row will be inserted at the first position. The value of -1 can also be used, this results in a new row being inserted at the last position. This parameter is required in Firefox and Opera, but optional in Internet Explorer, Chrome and Safari.If this parameter is omitted, insertRow() inserts a new row at the last position in Chrome, IE, Firefox and Opera, and at the first position in Safari. |
기술적 세부 사항
반환 값: | 삽입된 <tr> 요소 |
---|
더 많은 예
예시
행 생성 및 삭제:
function myCreateFunction() {
var table = document.getElementById("myTable");
var row = table.insertRow(0);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
cell1.innerHTML = "NEW CELL1";
cell2.innerHTML = "NEW CELL2";
}
function myDeleteFunction() {
document.getElementById("myTable").deleteRow(0);
}
관련 페이지
HTML 참조: HTML <tr> 태그
❮ 테이블 개체