码迷,mamicode.com
首页 > Web开发 > 详细

js中添加table

时间:2014-09-12 19:20:34      阅读:173      评论:0      收藏:0      [点我收藏+]

标签:js中添加table

<html>
<head>
    <title></title>
<script type="text/javascript">
    function getInnerHTML() {
        // alert(document.getElementById("tr1").innerHTML);
        var input = document.createElement("input");
        input.type = "text";
        input.id = "txte1";
        document.body.insertBefore(input, t1);
        init();
    }
    function init() {
        var table = document.createElement("table");
        var tbody = document.createElement("tbody");
        for (var i = 1; i < 10; i++) {
            var row = document.createElement("tr");
            row.id = i;
            if (i!=4 && i%2) {
                row.bgColor = "#ffff00";
            } else if (i == 4) {
                row.bgColor = "#ff0000";
            } else {
                row.bgColor = "#0000ff";
            }
            for (var j = 1; j < 6; j++) {
                var cell = document.createElement("td");
                cell.id = i + "/" + j;
                cell.appendChild(document.createTextNode("第" + cell.id + "列"));
                row.appendChild(cell);
            }
            tbody.appendChild(row);
        }
        table.appendChild(tbody);
        document.body.insertBefore(table,t1);
    }
</script>
</head>
<body>

<table id="t1" border="1">
<tr id="tr1">
<th>Firstname<span style=" display:none;">sd</span></th>
<th>Lastname</th>
</tr>
<tr id="tr2">
<td>Peter</td>
<td>Griffin</td>
</tr>
</table>
<br />
<input type="button"
value="Alert innerHTML of table row" />

</body>
</html>


本文出自 “” 博客,请务必保留此出处http://8532016.blog.51cto.com/8522016/1551686

js中添加table

标签:js中添加table

原文地址:http://8532016.blog.51cto.com/8522016/1551686

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!