表格的行能否用Javascript动态增加

<script>
function creates(){
newiframes=document.createElement("TABLE")
newiframes.id="t1"
newiframes.width="100"
newiframes.border="1"
newiframes.height="100"
newiframes.align="left"
newiframes.style.background="red"
newiframes.insertRow()
newiframes.rows[0].insertCell()
document.body.insertBefore(newiframes)
}
</script>
<body>
<input type=button value='加一个表格' onclick=creates()><br>
</body>

解决方案 »

  1.   

    <table cellspacing=1 cellpadding=1 border=0 width=100% id=t136>
      <tbody><form method=post >
      
      <tr bgcolor=F0F0F0>
        <td>&nbsp;</td>
        <td><div> 
            <input type=button onclick=addNew() value=增加 class=button_index>
          </div></td>
      </tr>
      <tbody>
    </table>
    <script>
    var i=0,arr=new Array('F9F9F9','F0F0F0');
    function addNew(){
    tr=document.all.t136.insertRow();
    tr.style.backgroundColor=arr[i%2];
    tr.insertCell().innerText=(++i);
    tr.insertCell().innerHTML='<a href=javascript:void(0) onclick=del()>删除</a>'
    }
    function del(){
    document.all.t136.deleteRow(window.event.srcElement.parentElement.parentElement.rowIndex);
    for(i=0;i<document.all.t136.rows.length-5;i++){
    document.all.t136.rows[i+5].cells[0].innerText=(i+1);
    document.all.t136.rows[i+5].cells[1].children[0].name="";
    document.all.t136.rows[i+5].style.backgroundColor=arr[i%2];
    }
    }
    </script>  这个就是你要的增加行
      

  2.   

    <html>
    <head>
    <title>无标题文档</title>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <script language="javascript">
    function addRow(src){
    //alert(src);
    var newrow = src.insertRow(src.rows.length-1);
    newrow.height=20;
    var i=4;
    while(i--){
    var newcell = newrow.insertCell();
    switch(i){
    case 0: newcell.innerHTML= '<input type="button" onClick="javascript:delRow(this.parentElement.parentElement)" value="删除此行">';break;
    default: newcell.innerHTML=div1.innerHTML;break;
    }
    }
    }
    function delRow(src){
    var tab=src.parentElement;
    var i=tab.rows.length;
    while(i--){
    if(src==tab.rows[i]){
    alert("就是这行----"+ i);
    tab.deleteRow(i);
    }
    }
    }
    </script>
    </head><body>
    <table id="tb" width="100%"  border="1" align="center" cellpadding="1" cellspacing="1" style="border-collapse:collapse" bordercolor="#111111">
      <tr>
        <th scope="col" width="25%">奶类</th>
        <th scope="col" width="25%">数量</th>
        <th scope="col" width="25%">总重</th>
        <th scope="col" width="25%">单价</th>
      </tr>
      <tr id="blankRow" onClick="addRow(this.parentElement)">
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
      </tr>
    </table>
    <div id="div1" style="display:none "><input id="txt" type="text" style="width:97%; background-color:#FFFFEF"></div>
    </body>
    </html>