html table 分页显示

可以使用 JavaScript 或者 jQuery 实现 HTML 表格的分页显示。具体实现方法如下：

1. 在 HTML 中添加一个表格和一个分页器的容器：

<table id="myTable">
  <!-- 表格内容 -->
</table>

<div id="pagination"></div>

2. 在 JavaScript 中定义每页显示的行数和当前页码：

var rowsPerPage = 10; // 每页显示的行数
var currentPage = 1; // 当前页码

3. 编写一个函数来根据当前页码和每页显示的行数来显示表格的某一页：

function showTablePage(page) {
  var startIndex = (page - 1) * rowsPerPage;
  var endIndex = startIndex + rowsPerPage;
  $('#myTable tbody tr').hide(); // 隐藏所有行
  $('#myTable tbody tr').slice(startIndex, endIndex).show(); // 显示当前页的行
}

4. 编写一个函数来生成分页器：

function generatePagination() {
  var numRows = $('#myTable tbody tr').length;
  var numPages = Math.ceil(numRows / rowsPerPage);
  var paginationHtml = '';
  for (var i = 1; i <= numPages; i++) {
    paginationHtml += '<a href="#" class="page-link" data-page="' + i + '">' + i + '</a>';
  }
  $('#pagination').html(paginationHtml);
}

5. 在页面加载完成后调用 `showTablePage` 和 `generatePagination` 函数，并且为分页器中的每个链接添加点击事件：

$(document).ready(function() {
  showTablePage(currentPage);
  generatePagination();
  $('#pagination').on('click', '.page-link', function(event) {
    event.preventDefault();
    currentPage = $(this).data('page');
    showTablePage(currentPage);
  });
});

这样就可以实现 HTML 表格的分页显示了。