如何從表中動態刪除/編輯行和列

Question

我已經創建了一個表，我正在動態添加行和列。我想刪除/編輯我添加的行和列。我已經包括了我的代碼

$('#irow').click(function(){ 
 
    if($('#row').val()){ 
 
     $('#mtable tbody').append('<tr><td>Some Item</td></tr>'); 
 
     $('#mtable tbody tr:last td:first').html($('#row').val()); 
 
    }else{alert('Enter Text');} 
 
}); 
 
$('#icol').click(function(){ 
 
    if($('#col').val()){ 
 
     $('#mtable tr').append($("<td>")); 
 
     $('#mtable thead tr>td:last').html($('#col').val()); 
 
     $('#mtable tbody tr').each(function(){$(this).children('td:last').append($('<input type="text">'))}); 
 
    }else{alert('Enter Text');} 
 
});

td{padding:5px;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 

 
<table border="1" id="mtable"> 
 
    <thead><tr><td>Employee \department</td></tr></thead> 
 
    <tbody></tbody> 
 
</table><br/><br/> 
 
<input id="row" placeholder="Enter Employee Name"/><button id="irow">Add Employee</button><br/><br/> 
 
<input id="col" placeholder="Enter department Name"/><button id="icol">Add department</button>

請幫我刪除/編輯的行和列在表

Answer 1

創建另一個輸入按鈕，在小提琴 所示，然後輸入指數要刪除的行。你可以決定減去，但輸入0將刪除第一行。

<code> 
    $('#dcol').click(function(){ 
     var index = $('#col').val(); 
     $('#mtable tbody').find('tr').eq(index).remove() 
    }) 

我準備了小提琴

https://jsfiddle.net/vdab98xk/

要刪除columnns

$('#mtable tr').each(function(){ 
    $(this).find('td').eq(index).remove(); 
}) 

編輯列

$('#mtable tr').eq(0).find('td').eq(index).text('New Value');