<html>
<head>
<script type="text/javascript">
function deleteAll(){
var tableName = document.getElementById("t1");
var rows = tableName.rows.length;
for(var i=rows-1;i>0;i--){
tableName.deleteRow(i);
}
}
function addRows(){
var tableName = document.getElementById("t1");
var rows = tableName.rows.length;
for(var j=10;j>0;j--){
var row = tableName.insertRow(rows);
row.οnmοuseοver=function(){
this.style.background="#DDFF22";
}
row.οnmοuseοut=function(){
this.style.background="#FFFFFF";
}
var cell1 = row.insertCell(0);
cell1.οnclick=function(){
alert(this.innerHTML);
}
cell1.innerHTML="row:"+j+";cell:"+1;
var cell2 = row.insertCell(1);
cell2.οnclick=function(){
alert(this.innerHTML);
}
cell2.innerHTML="row:"+j+";cell:"+2;
var cell3 = row.insertCell(2);
cell3.οnclick=function(){
alert(this.innerHTML);
}
cell3.innerHTML="row:"+j+";cell:"+3;
var cell4 = row.insertCell(3);
cell4.οnclick=function(){
alert(this.innerHTML);
}
cell4.innerHTML="row:"+j+";cell:"+4;
}
}
</script>
</head>
<body>
<table id="t1">
<thead>
<tr>
<th>A</th><th>B</th><th>C</th><th>D</th>
</tr>
</thead>
<tbody>
</tbody>
<input type="button" value="Delete" οnclick="deleteAll();"/>
<input type="button" value="Add" οnclick="addRows();"/>
</table>
</body>
</html>
js 操作table
最新推荐文章于 2024-05-16 16:52:30 发布
879
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
