在克隆中更改表格中的按鈕值

Question

我有一個帶有表格的模式（下圖）。

當我點擊添加按鈕時，它會將整行克隆到模態後面的表格中（下圖）。

我已成功克隆行，但我想將克隆行的按鈕值從「ADD」更改爲「REMOVE」。我該怎麼做？下面

代碼是如何克隆行

<script> 
     function addField(n) 
     { 
      var tr = n.parentNode.parentNode.cloneNode(true); 
      document.getElementById('tbl').appendChild(tr); 
     } 
</script> 

這是我的表

<?php 

    while($datatrack = mysqli_fetch_assoc($resultTrack)) 
    { 
     echo " 
     <tr> 
     <td>".$datatrack['Question_ID']."</td> 
     <td>".$datatrack['Question']."</td> 
     <td>".$datatrack['Track_Desc']."</td> 
     <td><input type='button' onclick='addField(this)' value='ADD'></td> 
     </tr>"; 
     } 
?> 

如何改變克隆行的按鈕值從「添加」到「刪除」？

Answer 1

你可以簡單地查詢在tr變量按鈕元素，然後將其值設置：

<script> 
    function addField(n) 
    { 
     var tr = n.parentNode.parentNode.cloneNode(true); 
     var buttonInput = tr.querySelector('[value="ADD"]'); 

     if (buttonInput) { 
      buttonInput.value = 'REMOVE'; 
     } 

     document.getElementById('tbl').appendChild(tr); 
    } 
</script>