js创建表格全选和全不选

在JavaScript中，你可以通过操作HTML表格的`<input>`元素和`<table>`元素来实现表格的全选和全不选功能。以下是一个简单的示例：

1. 全选：
当用户点击“全选”按钮时，遍历每一行的`<tr>`标签，并为其添加一个全选复选框。这个复选框默认会被设置为勾选状态。

<tr>
  <td><input type="checkbox" class="select-all" value="1"></td>
  <!-- 行的数据 -->
</tr>

var selectAllBtn = document.getElementById('selectAll');
selectAllBtn.addEventListener('click', function() {
  var checkboxes = document.querySelectorAll('.select-all');
  checkboxes.forEach(function(checkbox) {
    checkbox.checked = true;
  });
});

2. 全不选：
相反，在“全不选”按钮点击事件中，将所有复选框的`checked`属性设为`false`。

var unselectAllBtn = document.getElementById('unselectAll');
unselectAllBtn.addEventListener('click', function() {
  var checkboxes = document.querySelectorAll('.select-all');
  checkboxes.forEach(function(checkbox) {
    checkbox.checked = false;
  });
});

当你有多个表格需要这样的功能时，可以为每个表格分别绑定事件，或者封装成一个通用的方法，以便于复用。