JS 이용해서 동적으로 테이블 생성 > 개발자팁

개발자팁

개발과 관련된 유용한 정보를 공유하세요.
질문은 QA에서 해주시기 바랍니다.

JS 이용해서 동적으로 테이블 생성 정보

기타 JS 이용해서 동적으로 테이블 생성

본문

<script>
    function erase(o)
    {
        alert(document.getElementById(o));
        document.getElementById(o).removeChild(document.getElementById(o).getElementsByTagName('tr')[0]);
    }

    function make()
    {
        alert("우하하");
        var tbl     = document.getElementById("tbl");
        var tblBody = document.getElementById("tblBody");

        // creating all cells
        for (var j = 0; j < 2; j++) {
            // creates a table row
            var row = document.createElement("tr");

            for (var i = 0; i < 2; i++) {
                // Create a <td> element and a text node, make the text
                // node the contents of the <td>, and put the <td> at
                // the end of the table row
                var cell = document.createElement("td");
                var cellText = document.createTextNode("cell is row "+j+", column "+i);
                cell.appendChild(cellText);
                row.appendChild(cell);
            }

            // add the row to the end of the table body
            tblBody.appendChild(row);
        }
        tbl.setAttribute("border", "2");
    }
</script>

<input type="button" value="start" onclick="make()">
<input type="button" value="delete" onclick="erase('tblBody');">

<table id="tbl">
    <tbody id="tblBody">


    </tbody>
</table>
 
꼭 tbody 태그를 넣어야 한다는거 유의!!
[이 게시물은 관리자님에 의해 2011-10-31 17:16:08 PHP & HTML에서 이동 됨]
추천
0
  • 복사

댓글 0개

© SIRSOFT
현재 페이지 제일 처음으로