js在指定的table表格行后面添加新行:
有时候在实际应用中,需要在表格的指定行后面添加指定的行,下面就通过代码实例进行一下简单介绍,当然实现此效果的方式可能有很多种,这里只介绍其中的一种方式,代码实例如下:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>insertRow()函数-蚂蚁部落</title> <script type="text/javascript"> function insRow() { var otable=document.getElementById("thetable"); var R=otable.insertRow(1); var left=R.insertCell(0); var right=R.insertCell(1); left.innerHTML="div教程"; right.innerHTML="SEO教程"; } window.onload=function() { var bt=document.getElementById("bt"); bt.onclick=function() { insRow() } } </script> </head> <body> <table border="1" id="thetable"> <tr id="top"> <th>蚂蚁部落一</th> <th>蚂蚁部落二</th> </tr> <tr id="bottom"> <td>javascript教程</td> <td>jQuery教程</td> </tr> </table> <br /> <input type="button" id="bt" value="插入行"/> </body> </html>
以上代码实现了我们的要求,可以将新行添加到指定的行后面。
相关阅读:
1.insertRow()函数可以参阅js的insertRow()函数用法简单介绍一章节。
2. insertCell()函数可以参阅js的insertCell()函数简单介绍一章节。
原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=10551
更多内容可以参阅:http://www.softwhy.com/javascript/
原标题:js在指定的table表格行后面添加新行
关键词:JS