如何在现有表格后面添加一行?

daqi2010 2009-12-20 08:08:58
现有如下表格
<table id="mytab">
<tr><td>编号</td><td>姓名</td></tr>
<tr><td>1</td><td>小王</td></tr>
<tr><td>2</td><td>小明</td></tr>
<tr><td>3</td><td>小如</td></tr>
<tr><td>4</td><td>小陈</td></tr>
<tr><td>5</td><td>小赵</td></tr>
<tr><td>6</td><td>小刘</td></tr>
<tr><td>7</td><td>小王</td></tr>
<tr><td>8</td><td>小明</td></tr>
<tr><td>9</td><td>小如</td></tr>
<tr><td>10</td><td>小陈</td></tr>

---
</table>
行数是不确定的,
如何在最后一行之后插入:<tr><td>合计</td><td>10人</tD></tr>
如何在<table>之后插入:<THEAD style="display:table-header-group;">
如何在第一个</tr>后插入:</thead><tbody>
如何在</table> 之前插入:</TBODY><TFOOT style="display:table-footer-group;"></TFOOT>
从第5行开始,3行的倍数的样式为:style="page-break-after:always;"
最终于形成如下表格:

<table>
<THEAD style="display:table-header-group"> //新插入的
<tr><td>编号</td><td>姓名</td></tr>
</THEAD><TBODY> //新插入的
<tr><td>1</td><td>小王</td></tr>
<tr><td>2</td><td>小明</td></tr>
<tr><td>3</td><td>小如</td></tr>
<tr style="page-break-after:always;"><td>4</td><td>小陈</td></tr>
<tr><td>5</td><td>小赵</td></tr>
<tr><td>6</td><td>小刘</td></tr>
<tr style="page-break-after:always;"><td>7</td><td>小王</td></tr>
<tr><td>8</td><td>小明</td></tr>
<tr><td>9</td><td>小如</td></tr>
<tr style="page-break-after:always;"><td>10</td><td>小陈</td></tr>

---
</TBODY><TFOOT style="display:table-footer-group;"></TFOOT> //新插入的
</table>
...全文
973 6 打赏 收藏 转发到动态 举报
写回复
用AI写文章
6 条回复
切换为时间正序
请发表友善的回复…
发表回复
dzl84394 2009-12-21
  • 打赏
  • 举报
回复
学习
daqi2010 2009-12-21
  • 打赏
  • 举报
回复
谢谢楼上的大哥,特别要谢谢lindabang
我刚才测试了一下,有点小问题:
(1),新增了二行
(2)
如何在 <table>之后插入: <THEAD style="display:table-header-group;">
如何在第一个 </tr>后插入: </thead> <tbody>
如何在 </table> 之前插入: </TBODY> <TFOOT style="display:table-footer-group;"></TFOOT>
没有成功
望lindabang好人再帮我一下,谢谢!
lindabang 2009-12-20
  • 打赏
  • 举报
回复
该死的,忘了最后一句最重要的没有加了.

要在上面的</script>前加入:

mytatable_innerhtml+="</table>";
mytable.innerHTML=mytatable_innerhtml;
lindabang 2009-12-20
  • 打赏
  • 举报
回复
//好人做到底,帮你全写了.
//很简单,注释就不写了
<script language="javascript">
var mytable=document.getElementById("mytab");

lastRow_str="<tr> <td>合计 </td> <td>10人 </tD> </tr>";
lastRow=document.createElement(lastRow_str);
mytable.appendChild(lastRow);//以上三句在表格最后插入一行

var firstRow=mytable.rows[0];

var table_innerhtml="";
table_innerhtml+='<THEAD style="display:table-header-group;">';
table_innerhtml+="<tr>"+firstRow.innerHTML+"</tr><tbody>"; //

for(var i=1;i<mytable.rows.length;i++)
{
table_innerhtml+="<tr>"+mytable.rows[i].innerHTML+"</tr>";
if(i>5&&i%3==0)
mytable.rows[i].style.cssText="page-break-after:always;";
}
table_innerhtml+='</TBODY> <TFOOT style="display:table-footer-group;"> </TFOOT>';


</script>

//如果经过查检,没有经过调试,如果有错,请告诉我
xiaofan_sap 2009-12-20
  • 打赏
  • 举报
回复
tbl.insertRow(-1);
ok
Click_Me 2009-12-20
  • 打赏
  • 举报
回复

tbl.insertRow(-1);

87,910

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧