表格 前端分页js实现，第一页从第4条数据开始取，每次取10条，第二页从第14条数据开始取，一次取10条

前端表格分页的JavaScript实现通常涉及以下几个步骤：

1. **初始化状态**：假设你有一个数组`data`代表所有数据，你可以创建一个变量`currentPage`表示当前页面，初始值设为1（即第一页），每页显示的数据量为`pageSize`，例如10。

let currentPage = 1;
const pageSize = 10;
let start = (currentPage - 1) * pageSize; // 计算起始位置

2. **获取数据**：使用`start`作为偏移量从原始数组中截取对应范围的数据。例如，第四条数据到第十条数据（第一页）或第十四条到第二十三条（第二页）。

function fetchData() {
    const dataSlice = data.slice(start, start + pageSize);
    return dataSlice;
}

3. **分页处理**：当用户请求下一页时，更新`currentPage`并重新加载数据。如果请求的是第二页及以上，需要调整起始位置。

function nextPage() {
    if (currentPage < totalPages) { // 检查是否还有更多页
        currentPage++;
        start += pageSize;
        renderData(); // 渲染新的数据
    }
}

function prevPage() {
    if (currentPage > 1) {
        currentPage--;
        start -= pageSize;
        renderData();
    }
}

4. **渲染界面**：将`fetchData`返回的数据传递给前端模板，如React、Vue或原生HTML，动态更新表格内容。

function renderData() {
    const pageData = fetchData();
    // 更新UI展示，比如表格元素
    document.getElementById('table-body').innerHTML = '';
    pageData.forEach(item => {
        // 生成DOM节点插入表格
        createTableRow(item);
    });
}