3. 分页函数
").text(data[i]);
// 将元素添加到容器中
$("#dataContainer").append(item);
}
}
```
在这个示例中，我们首先定义了每页显示的数据条数pageSize，然后根据当前页码page计算起始索引startIndex和结束索引endIndex。接下来，我们获取总数据数组data，并通过一个for循环遍历并创建DOM元素，将数据添加到容器中。
4. 分页按钮
接下来，我们需要在页面中添加分页按钮，让用户可以切换不同的页码。以下是一个示例的HTML结构：
```html
```
这里我们使用了class="pageBtn"来选择所有的分页按钮，以便在后面绑定点击事件。
5. 点击事件
最后，我们需要为分页按钮绑定点击事件，当用户点击按钮时，调用分页函数显示对应的数据块。以下是一个示例的jQuery代码：
```javascript
$(document).ready(function() {
// 绑定点击事件
$(".pageBtn").click(function() {
var page = parseInt($(this).text()); // 获取按钮上的页码
showPage(page); // 调用分页函数
});
// 默认显示第一页的数据
showPage(1);
});
```
在这个示例中，我们通过$(document).ready()函数来确保页面加载完成后再执行脚本。然后，我们使用$(".pageBtn").click()来选择所有的分页按钮，并为它们绑定点击事件。当用户点击按钮时，我们通过$(this).text()获取按钮上的页码，并将其转换为整数类型。最后，我们调用showPage函数，传入页面参数来显示对应的数据块。
三、实用方法
除了基本的分页功能，jQuery还提供了许多实用的方法来增强和优化分页体验。
1. 动态生成分页按钮
在上面的示例中，我们手动添加了静态的分页按钮。如果数据量很大，需要动态生成按钮并根据数据总数自动计算页数，可以使用以下方法：
```javascript
function generatePagination() {
var pageSize = 10; // 每页显示的数据条数
var total = getData().length; // 获取总数据条数
var totalPages = Math.ceil(total / pageSize); // 计算总页数
// 清空之前的按钮
$("#pagination").empty();
// 生成分页按钮
for (var i = 1; i <= totalPages; i++) {
var btn = $("
