信鸽网

javascript 操作table的特性

  作者：bea

<html xmlns="http://www.w3.org/1999/xhtml" > <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"/> <title>javascript操作table的特性</title> <script type="text/javascript"><!-- functi


<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
<title>javascript操作table的特性</title>
<script type="text/javascript"><!--
function f(){
//创建一个表格
var oTable = document.createElement("table");
oTable.setAttribute("border","1");
oTable.setAttribute("width","300px");
//
var oTBody = document.createElement("tbody");
oTable.appendChild(oTBody);
//创建第一行
oTBody.insertRow(0);
oTBody.rows[0].insertCell(0);
oTBody.rows[0].cells[0].appendChild(document.createTextNode("Cell 1,1"));
oTBody.rows[0].insertCell(1);
oTBody.rows[0].cells[1].appendChild(document.createTextNode("Cell 2,1"));
//创建第二行
oTBody.insertRow(1);
oTBody.rows[1].insertCell(0);
oTBody.rows[1].cells[0].appendChild(document.createTextNode("Cell 1,2"));
oTBody.rows[1].insertCell(1);
oTBody.rows[1].cells[1].appendChild(document.createTextNode("Cell 2,2"));
//
document.body.appendChild(oTable);
}

// --></script>
</head>
<body onclick="f();">
<div>hello</div>
<table border="1" width="300px">
<tbody>
<tr>
<td>Cell 1,1</td>
<td>Cell 2,1</td>
</tr>
<tr>
<td>Cell 1,2</td>
<td>Cell 2,2</td>
</tr>
</tbody>
</table>
</body>
</html>




[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行]

可以直接点击页面的任何部分即可看到效果。


有用  |  无用

猜你喜欢

您可能感兴趣的文章: