테스트 사이트 - 개발 중인 베타 버전입니다

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

· 18년 전 · 2732
<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에서 이동 됨]

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

게시판 목록

프로그램

글쓰기