分页。如何通过点击数字在页面之间移动

<div id="dataContainer">
  <!-- 数据展示容器 -->
</div>

<div id="paginationContainer">
  <!-- 分页导航容器 -->
</div>

// 数据源（示例数据）
const data = [
  { id: 1, name: '数据1' },
  { id: 2, name: '数据2' },
  // 更多数据...
];

// 每页显示的数据条数
const pageSize = 10;

// 当前页码
let currentPage = 1;

// 显示当前页数据
function displayCurrentPageData() {
  const start = (currentPage - 1) * pageSize;
  const end = start + pageSize;
  const currentPageData = data.slice(start, end);
  
  // 渲染当前页数据到页面
  const dataContainer = document.getElementById('dataContainer');
  dataContainer.innerHTML = '';
  for (const item of currentPageData) {
    const itemElement = document.createElement('div');
    itemElement.textContent = item.name;
    dataContainer.appendChild(itemElement);
  }
}

// 生成页码导航
function generatePagination() {
  const totalPages = Math.ceil(data.length / pageSize);
  
  // 渲染页码导航到页面
  const paginationContainer = document.getElementById('paginationContainer');
  paginationContainer.innerHTML = '';
  for (let i = 1; i <= totalPages; i++) {
    const pageLink = document.createElement('a');
    pageLink.href = '#';
    pageLink.textContent = i;
    pageLink.addEventListener('click', () => {
      currentPage = i;
      displayCurrentPageData();
    });
    paginationContainer.appendChild(pageLink);
  }
}

// 初始化分页
function initializePagination() {
  displayCurrentPageData();
  generatePagination();
}

// 初始化分页
initializePagination();