本文介绍如何使用 datatables api 精确获取并操作当前分页（而非全部数据）中的 dom 节点，实现“全选当前页”功能，避免误操作跨页数据。
本文介绍如何使用 datatables api 精确获取并操作当前分页（而非全部数据）中的 dom 节点，实现“全选当前页”功能，避免误操作跨页数据。
在使用 jQuery DataTables 实现带分页的表格时，常见需求是：点击“全选”按钮，仅勾选当前可见页的所有行（即当前分页范围内的 <tr> 元素），而非整个数据源的所有记录。若直接调用 <code>table.rows().nodes() 或旧版 API 的 fnGetNodes()，会返回全部页面的数据节点，无法满足分页上下文下的精准控制。
✅ 正确做法：使用现代 DataTables API 的 rows({ page: 'current' })
DataTables 1.10+ 提供了强大且语义清晰的 rows() 方法筛选器。要仅获取当前页的行节点，应使用：
// 假设 table 是已初始化的 DataTables 实例（如：var table = $('#example').DataTable();）
var currentPageNodes = table.rows({ page: 'current' }).nodes();
该方法返回一个包含当前页所有 <tr> DOM 元素的 jQuery 对象（内部为 <code>$.fn.dataTable.Api 实例），可直接用于遍历、添加 class、触发 checkbox 状态变更等操作。
? 实际应用示例（配合复选框全选）
// 绑定“当前页全选”按钮
$('#select-current-page').on('click', function() {
var rows = table.rows({ page: 'current' }).nodes();
// 遍历当前页所有行，查找并勾选其复选框（假设每行第一列为 <input type="checkbox">）
$(rows).find('input[type="checkbox"]').prop('checked', true);
// 可选：同步更新全选状态（如表头复选框）
if (rows.length > 0) {
$('#header-checkbox').prop('checked', true);
}
});
// 取消全选同理
$('#unselect-current-page').on('click', function() {
table.rows({ page: 'current' }).nodes().to$().find('input[type="checkbox"]').prop('checked', false);
});
⚠️ 注意事项
- ❌ 不要混用新旧 API：
fnGetNodes()属于 1.9.x 旧版接口，已弃用；在新版中请统一使用rows().nodes()配合筛选对象。 - ✅ 确保
table是通过DataTable()初始化的实例（非 jQuery 对象），否则rows()方法不可用。 - ? 若需获取当前页的原始数据对象（而非 DOM 节点），可使用
table.rows({ page: 'current' }).data()。 - ? 如需监听分页变化后自动重置选择状态，建议结合
page.dt事件处理。
掌握 rows({ page: 'current' }) 是实现分页感知交互的关键——它让前端逻辑真正与用户当前视图保持一致，提升体验与数据准确性。
jQuery 1.12.4
下载
jQuery 1.12.4是jQuery 1.x系列的最后一个正式稳定版本，由jQuery团队于2016年发布。该版本主要面向需要兼容旧版浏览器环境的网站和Web应用，尤其适用于仍需支持Internet Explorer 6、Internet Explorer 7、Internet Explorer 8等老旧浏览器的项目。
