리자

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

· 2007-05-08 (화) 09:37:31 · 2803
<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에서 이동 됨]
|
댓글을 작성하시려면 로그인이 필요합니다.

팁게시판

6,077건

디자인과 관련된 유용한 정보를 공유하세요. 질문은 상단의 QA에서 해주시기 바랍니다.

+
제목 글쓴이 날짜 조회
07-05-26 조회 2,035
07-05-20 조회 3,168
07-05-18 조회 4,790
07-05-18 조회 2,924
07-05-17 조회 8,091
07-05-17 조회 4,111
07-05-17 조회 2,799
07-05-16 조회 1,578
07-05-16 조회 2,672
07-05-15 조회 5,092
07-05-14 조회 5,274
07-05-13 조회 2,153
07-05-11 조회 4,418
07-05-10 조회 4,158
07-05-10 조회 4,215
07-05-09 조회 2,332
07-05-09 조회 4,258
07-05-09 조회 2,235
07-05-09 조회 3,344
07-05-09 조회 4,979
07-05-08 조회 2,016
07-05-08 조회 3,427
07-05-08 조회 1,705
07-05-08 조회 2,804
07-05-07 조회 1,728