js 分页

// 简单的 JavaScript 分页示例

// 假设我们有一个包含大量数据的数组
const data = Array.from({ length: 100 }, (_, i) => `Item ${i + 1}`);

// 每页显示的项目数量
const itemsPerPage = 10;

// 当前页码
let currentPage = 1;

// 获取分页数据的函数
function getPagedData(data, page, itemsPerPage) {
    const startIndex = (page - 1) * itemsPerPage;
    const endIndex = startIndex + itemsPerPage;
    return data.slice(startIndex, endIndex);
}

// 显示分页数据的函数
function displayPagedData() {
    const pagedData = getPagedData(data, currentPage, itemsPerPage);
    console.log(`Page ${currentPage}:`, pagedData);
}

// 切换页面的函数
function changePage(newPage) {
    if (newPage >= 1 && newPage <= Math.ceil(data.length / itemsPerPage)) {
        currentPage = newPage;
        displayPagedData();
    } else {
        console.log('Invalid page number');
    }
}

// 初始化显示第一页的数据
displayPagedData();

// 示例：切换到第2页
changePage(2);

// 示例：切换到第5页
changePage(5);

解释说明：

1. 数据准备：我们创建了一个包含100个项目的数组 data，模拟大量数据。
2. 分页参数：定义了每页显示的项目数量 itemsPerPage 和当前页码 currentPage。
3. 获取分页数据：getPagedData 函数根据当前页码和每页显示的项目数量，从数据数组中提取相应的子数组。
4. 显示分页数据：displayPagedData 函数调用 getPagedData 并将结果打印到控制台。
5. 切换页面：changePage 函数允许用户切换到指定的页码，并检查页码是否有效。
6. 初始化显示：程序启动时，默认显示第一页的数据。

你可以根据需要进一步扩展这个示例，例如添加分页按钮、前后翻页功能等。