在这种特定情况下，如何使用javascript删除HTML元素

我有这个脚本，它有两个任务：

添加/删除动态输入框元素，我们称之为“输入框”

在输入框上添加/删除一个值，将其称为“输入框”

假设有一个空的输入框，每当我单击“添加”时，它会添加1，当我单击“删除”时，它会删除1

现在，执行任务1，即添加/删除输入框，也会添加和删除“输入框”的值

我的问题是，假设我三次单击任务2上的添加按钮，它会在“输入框”上添加3个值，当我使用任务1添加三个输入框时，它会再添加3个附加值，现在的总数是6，如果我两次、三次单击任务上的删除按钮，它会减去3个值

我想要的是，当我第四次单击任务2上的“删除”按钮时，我还想删除以前使用任务1添加的输入框

这是我对这段代码的参考这是它的基本功能，

以下是脚本：

$(document).ready(function(e) {

  var $input = $("#b_size");
  var maxRows = 20;
  var x = 1;

  var html = '';
  html += '<tr>';
  html += '<td><input type="text" name="b_title[]" class="form-control"/></td>';
  html += '<td><input type="number" name="b_page[]" class="form-control"/></td>';
  html += '<td><input type="text" name="b_author[]" class="form-control"/></td>';
  html += '<td><input type="text" name="b_publication[]" class="form-control"/></td>';
  html += '<td><input type="text" name="b_type[]" class="form-control"/></td>';
  html += '<td><input type="number" name="b_price[]" class="form-control"/></td>';
  html += '<td><button type="button" id="remove" class="btn btn-danger">Remove</span>  <
    /button></td > < /tr> </div > ';

  $input.val(0);

  $(".alter").click(function() {
    if ($(this).hasClass('plus_one'))
      $input.val(parseInt($input.val()) + 1);
    else if ($input.val() >= 1)

      $input.val(parseInt($input.val()) - 1);

    else if ($input.val() == 0) // This part
      $("#b_table").on('change', function(e) { //is just 
        $(this).closest('tr').remove(); // what I assume
        x--; // to be 
      }); // the solution

  });

  $("#add").click(function(e) {
    if (x <= maxRows) {
      $("#b_table").append(html);
      x++;
      $input.val(parseInt($input.val()) + 1);
    }
  });

  $("#b_table").on('click', '#remove', function(e) {

    $(this).closest('tr').remove();
    x--;
    $input.val(parseInt($input.val()) - 1);
  });

});

<table class="table table-bordered table-repsonsive" id="b_table">
    <tr>
        <th>Title</th>
        <th>Page</th>
        <th>Author</th>
        <th>Publication</th>
        <th>Type</th>
        <th>Price</th>
        <th><button type="button" id="add" class="btn btn-primary">Add</button></th>
    </tr>
</table>

 <div class="input-group-append" role="group" >
    <input type="text" class="form-control" name="b_size" id="b_size"/>
    <button type="button" class="btn btn-primary alter plus_one"><i class="fas fa-plus"></i></button>
    <button type="button" class="btn btn-danger alter minus_one"><i class="fas fa-minus"></i></button>
  </div>

$（文档）.ready（函数（e）{
var$input=$（“#b#u大小”）；
var maxRows=20；
var x=1；
var html=''；
html+=''；
html+=''；
html+=''；
html+=''；
html+=''；
html+=''；
html+=''；
html+='删除<
/按钮>'；
$input.val（0）；
$（“.alter”）。单击（函数（）{
if（$（this）.hasClass（'plus_one'））
$input.val（parseInt（$input.val（））+1）；
如果（$input.val（）>=1），则为else
$input.val（parseInt（$input.val（））-1）；
else if（$input.val（）==0）//此部分
$（“#b#u table”）。在（'change'）上，函数（e）{//
$（this）.closest（'tr'）.remove（）；//我的假设
x--；//待
})解决办法
});
$（“#添加”）。单击（函数（e）{
如果（x=1）
$input.val（parseInt（$input.val（））-1）；
});
$（“#添加”）。单击（函数（e）{
如果（x在递减计数器时，检查它是否小于表中的行数。如果小于，则删除最后一行


$（文档）.ready（函数（e）{
var$input=$（“#b#u大小”）；
var maxRows=20；
var x=1；
var html=''；
html+=''；
html+=''；
html+=''；
html+=''；
html+=''；
html+=''；
html+=''；
html+=“删除”；
$input.val（0）；
$（“.alter”）。单击（函数（）{
if（$（this）.hasClass（'plus_one'））
$input.val（parseInt（$input.val（））+1）；
如果（$input.val（）>=1），则为else{
$input.val（parseInt（$input.val（））-1）；
if（$input.val（）<$（“#b_表tr:has（input）”）.length）{
$（“#b#u table tr:has（input）”）.last（）.remove（）；
}
}
});
$（“#添加”）。单击（函数（e）{
如果（x）id必须是唯一的，你不能在每一行都使用
id=“remove”
。将其更改为类，你的代码就会工作。我不确定我是否遵循，但在我的示例中，“remove”工作正常，我需要的是当输入框b的值达到零时，我还想从任务1中删除添加的输入框a，这不是
$（这）.tr.remove（）
是吗？当我单击“添加”按钮时，它会添加一个输入框或一个表行，同时，它还会在“输入框”中添加一个值，当我单击“删除”按钮时，它会删除“输入框”中的一个值。现在，在“输入框”旁边有另一个“添加”和“删除”按钮，它还会添加和删除值。我不明白你为什么有两个按钮添加按钮，以及为什么在第一行有一个删除按钮。第一行的按钮只是更新计数器，它们对表没有任何作用，这有什么意义？这是按预期工作的，虽然有一个小问题或轻微的问题，假设框B上有3个值，还有3个输入字段，当我删除1个值时，它变成了2，所以它小于输入框的数量，它所做的是删除所有内容，其中应该还有两个输入框。好的，也许我正在推它，但这会很好，非常感谢。如果它没有删除所有内容，它如何知道要删除哪一个？我认为删除所有内容很奇怪，但我问这是什么我再次道歉，我不善于沟通。既然你提到了，我想知道同样的事情，这让我感到困惑。如果框B的值大于输入字段的数量或框A的数量是可以的，但如果输入框的数量大于框B的值的数量是不可以的一次拆一个盒子的方法？