日期:2014-05-16 浏览次数:20375 次
使用insertRow ()和insertCell()动态添加表格
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> </head> <script type="text/javascript"> function addRow(){ //添加一行 var newTr = testTbl.insertRow(); //添加三列 var newTd0 = newTr.insertCell(); var newTd1 = newTr.insertCell(); var newTd2 = newTr.insertCell(); //设置列内容和属性 newTd0.innerHTML = '<input type=checkbox id="box4">'; newTd1.innerHTML = ''; newTd2.innerHTML= '新加行'; } </script> <body> <table id="testTbl" border=1 width="30%"> <tr> <td><input type=checkbox id="box1"></td> <td id="b">第一行</td> <td id="b">第一行</td> </tr> <tr> <td><input type=checkbox id="box2"></td> <td id="b">第二行</td> <td id="b">第二行</td> </tr> <tr> <td><input type=checkbox id="box3"></td> <td>第三行</td> <td>第三行</td> </tr> </table> <a href="javascript:addRow()">增加</a> </body> </html>