拳王阿里 剧情:在页面中动态添加一行以及删除一行列表

来源:百度文库 编辑:偶看新闻 时间:2024/05/01 11:58:20
在页面中动态添加一行以及删除一行列表

今天要实现一个在页面中动态添加以及删除一行列表的功能,查找了几种方法,在此备份,以便日后使用:

========================此方法比较简洁,而且可以解决问题========================
function deleteCurrentRow()//刪除當前行
{
  var currRowIndex=event.srcElement.parentNode.parentNode.rowIndex;
  document.all.table10.deleteRow(currRowIndex);//table10--表格id
}


function insertRow()
{
  var nRow=document.all.table10.rows.length; //表格的總行數
  var objTheRow=document.all.table10.insertRow(nRow);//在最下邊新增一行
  objTheRow.insertCell(0);//新增一個單元格
  objTheRow.insertCell(1);
  objTheRow.insertCell(2);
  objTheRow.cells(0).innerHTML=nRow;//對新增的單元格?容
  objTheRow.cells(1).innerHTML=" ";
  objTheRow.cells(2).innerHTML="";
}

====================我的程序代码======================





cfbcard.html




     


     
 

 
       
   
   
   
   
   
   
   
   
   
   
   
   
   
     
    
       
   
111222333444555666777888999000123456789删除

   



=================================另外一种方法==============
如何删除表格的行上次讲到了如何动态给表格增加行,那么这次就讲讲如何删除表格的行了。首先建立一个表格,


 
 
 
 
 
 
 
 
 
 
姓名地址
nameaddress

取得tbody的元素var mailbody = document.getElementById("mainbody");,
接着取得要删除行的元素var cell = document.getElementById("delCell");
最后就是从tbody中移去要删除的行就可以了mainbody.removeChild(cell);
完整的代码如下:


 动态删除表格的行
 



 
 
 
 
 
 
 
 
 
 
姓名地址
nameaddress