table的动态插入和删除

table的动态插入和删除

<! DOCTYPE   HTML   PUBLIC   "-//W3C//DTD   HTML   4.01   Transitional//EN"   
  "http://www.w3.org/TR/html4/loose.dtd" >
< 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 >