js动态添加、删除表格，兼容IE、FireFox、Chrome

最新推荐文章于 2021-12-17 16:36:04 发布

原创最新推荐文章于 2021-12-17 16:36:04 发布 · 1.2k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#firefox #ie #input #table #class #function

本文介绍了一段JavaScript代码，该代码实现了网页上表格的行添加和删除功能。通过获取表格元素，可以动态地向表格中插入新行并填充特定内容，并提供删除按钮以移除指定行。适用于需要灵活管理表格数据的前端应用。

function addTable(){
var table=document.getElementById("specialtyTable");
if(table){

    var newRow =table.insertRow(table.rows.length);
    var cell =newRow.insertCell(0);
    cell.innerHTML='专业代码*';
    cell=newRow.insertCell(1);
    cell.innerHTML=' <input name="spno" type="text" class="input" style="width:99% ">';
    cell=newRow.insertCell(2);
    cell.innerHTML='专业名称*';
    cell=newRow.insertCell(3);
    cell.innerHTML='<input name="spno" type="text" class="input" style="width:99% ">';
    cell=newRow.insertCell(4);
    cell.innerHTML='<input name="Submit" type="button" class="buttonface02" value=" 删除   " onclick="removeCurrentRow(this);">';
   }
  }

  function removeCurrentRow(event_ff){

   var table =document.getElementById("mytable");
   var obj = (document.all)?event.srcElement:event_ff; //支持document.all的是IE
   if(table ){
    var index= obj.parentNode.parentNode.rowIndex;
    //             事件源"删除"    <td>       <tr>

    table.deleteRow(index);
   }
  }