[javascript] 테이블의 행추가 행삭제

여기서 e는 테이블

e는 테이블 id 를 넣으면 됨

function addRow(e)
{
num++;

//num은 들어갈 행번호 2면 3번째줄에 추가
var oRow = e.insertRow(num);

///////////////높이

oRow.height ="10";

//들어갈 td 만큼 만듬!!
var oCell1 = oRow.insertCell();
var oCell2 = oRow.insertCell();
var oCell3 = oRow.insertCell();
////// insertCell() 자체가 <td></td>이기때문에 적어줄필요없이 td 안의 내용만 적어주면됨

그러나 td자체에 스타일주기가 좀 까다로움

oCell1.innerHTML = "<p style='font-family:굴림;font-size:12'>&nbsp;<input type='text' name='book"+num+"' style='width:96%'>

</p>";
oCell2.innerHTML = "<p style='font-family:굴림;font-size:12'>&nbsp;<input type='text' name='writer"+num+"' style='width:96%'></p>";
oCell3.innerHTML = "<p style='font-family:굴림;font-size:12'>&nbsp;<input type='text' name='publish"+num+"' style='width:96%'></p>";
}

//// 테이블 행 삭제
function delRow(e)
{
var oTr = e.deleteRow(num);
num--;
}

 

Tistory 태그: td 추가,td 삭제