javascript当中,如何创建一个table的row和cell?
例 2.2(CreateTRTD3IEFF.html)
马克- to-win:马克 java社区:防盗版实名手机尾号: 73203。
<HTML>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<TITLE></TITLE>
</HEAD>
<BODY id="body">
</BODY>
</HTML>
<script>
/*Node.appendChild() (Method)
A new child node object is added to the end of the list of immediate children of this node. 马克-to-win: note: immediate is very important, table and tr is not immidiate,so table can not appendChild tr, while, table can append tbobdy, then tbody append tr. if you really want to connect table and tr, you must use insertRow like in this example.
Document.createElement() (Method)
A method to create a new element within a document.
Property/method value type: Element object
*/
var table = document.createElement("table");
/*TABLE.border (Property)
The width of the border around cells in a table.
*/
table.border=2;
//为表格循环插入2行
for (var i = 0 ; i < 2 ; i++)
{
/*
TABLE.insertRow() (Method)
Insert a new row into the table at a specified row index.
Property/method value type: TR object
JavaScript syntax: - myTABLE.insertRow(anIndex)
Argument list: anIndex The row at which to insert a new row
马克-to-win:note that Table has this method of "insertRow" which directly insert a row into a table without passing through tbody.
*/
var tr = table.insertRow(i);
//为每行循环插入3列
for (var j = 0 ; j < 3 ; j++)
{
/*TR.insertCell() (Method)
You can insert an additional cell into the row within a table with this method.
returned Property/method value type: TD object
*/
var td = tr.insertCell(j);
//设置每个单元格的内容
td.innerHTML = "车位" + i + j;
}
}
/*
Node.appendChild() (Method)
A new child node object is added to the end of the list of immediate children of this node.
Property/method value type: Node object
JavaScript syntax: - myNode.appendChild(aNode)
Argument list: aNode The node to be appended
*/
document.getElementById("body").appendChild(table);
</script>