JS动态生成表格

最新推荐文章于 2022-11-01 21:52:02 发布

Virgo_S

最新推荐文章于 2022-11-01 21:52:02 发布

阅读量102

点赞数

分类专栏： JS 文章标签： Java Go

本文链接：https://blog.csdn.net/Virgo_S/article/details/83249750

版权

JS 专栏收录该内容

41 篇文章 0 订阅

订阅专栏

增加：

<html>
<script>
function dy(){
	var row=document.createElement("tr");
	var cell=document.createElement("td");
	cell.appendChild(document.createTextNode("afsafaf"));
	row.appendChild(cell);
	document.getElementById("newbody").appendChild(row);
}

</script>
<body>
<br>
<a name="top" href="#here">go here</a>
<br>
<input type=button value="动态生成" onclick="dy()"/>
<br>
<table>
	<tbody id="newbody"></tbody>
</table>
<br>

</body>
</html>

var obj = document.createElement("table");
    var tbody = document.createElement("tbody");
    var tr = document.createElement("tr");
    var td = document.createElement("td");
    td.innerText = "AAA"
    tr.appendChild(td);
    tbody.appendChild(tr);
    obj.appendChild(tbody);
    document.all.Form1.appendChild(obj);
    var obj2 = new Array();
    for (var i=0;i<5;i++)
    {    
        obj2[i] = obj.cloneNode(true);
        obj2[i].setAttribute("border","1");
        document.all.Form1.appendChild(obj2[i]);
    }

减少：

deleteRow


<html>
<head>
<title> </title>
<script   language= "JavaScript ">
window.onload   =   function()
{
        T();
}

function   T()
{
        var   t   =   document.getElementById( "tab ");
        if(t.rows.length   >   0)
        {
                t.deleteRow(0);
                setTimeout( "T() ",   1000);
        }        
}
</script>
</head>
<body>
<TABLE   id= "tab "   border= "1 ">
<TR> <TD> 1 </TD> <TD> 2 </TD> <TD> 3 </TD> <TD> 4 </TD> </TR>
<TR> <TD> 5 </TD> <TD> 6 </TD> <TD> 7 </TD> <TD> 8 </TD> </TR>
<TR> <TD> 9 </TD> <TD> 10 </TD> <TD> 11 </TD> <TD> 12 </TD> </TR>
<TR> <TD> 13 </TD> <TD> 14 </TD> <TD> 15 </TD> <TD> 16 </TD> </TR>
</TABLE>

</body>
</html>