|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>Table test</title> </head> <body> <table id="table1" bordercolor="#000000" width="200" border="1"> <tbody> <tr> <td>00</td> <td>01</td> <td>02</td> <td>03</td> </tr> <tr> <td>10</td> <td>11</td> <td>12</td> <td>13</td> </tr> <tr> <td>20</td> <td>21</td> <td>22</td> <td>23</td> </tr> <tr> <td>30</td> <td>31</td> <td>32</td> <td>33</td> </tr> <tr> <td>40</td> <td>41</td> <td>42</td> <td>43</td> </tr> </tbody> </table> <br/> <input type="button" value="删除一行" onclick="deleteRow()"/> <input type="button" value="删除一列" onclick="deleteColumn()"/> <p> ===================== </p> <input type="button" value="addrow" onclick="addrow()" /> <input type="button" value="delrow" onclick="delrow()" /> <div id="tableTest"> </div> </body> </html> <script language="JavaScript" type="text/javascript"> function addrow() { var tab=document.getElementById("table2"); var _tr=tab.insertRow(tab.rows.length); //创建八列 for(var j=0;j<8;j++){ var _td=_tr.insertCell(j); //var _tn=document.createTextNode(i.toString()+j.toString()); var t=document.createElement("input"); t.size=20; t.value="aaaaa"; _td.appendChild(t); } } function delrow() { var tab=document.getElementById("table2"); tab.deleteRow(tab.rows.length-1); } <!-- //获取容器div的引用 var container=document.getElementById("tableTest"); //创建表格对象 var _table=document.createElement("table"); _table.id="table2"; //设置表格属性 _table.setAttribute("border","1"); _table.setAttribute("borderColor","black"); _table.setAttribute("width","200"); //创建一行 for(var i=0;i<1;i++){ var _tr=_table.insertRow(i); //创建八列 for(var j=0;j<8;j++){ var _td=_tr.insertCell(j); //var _tn=document.createTextNode(i.toString()+j.toString()); var t=document.createElement("input"); t.size=20; _td.appendChild(t); } } //将表格显示于页面 container.appendChild(_table); //--> </script> <script language="JavaScript" type="text/javascript"> <!-- //获得表格对象 var _table=document.getElementById("table1"); //定义函数,用于删除第一行 function deleteRow(){ _table.deleteRow(0); } //定义函数,用于删除第一列 function deleteColumn(){ //删除一列时需要对每一行分别进行列删除 for(var i=0;i<_table.rows.length;i++){ _table.rows.deleteCell(0); } } //--> </script>
|
一共有 0 条评论