js实现分页并请求ajax

<div id="content"></div>
<button onclick="prevPage()">Previous</button>
<button onclick="nextPage()">Next</button>

let currentPage = 1;
const pageSize = 10;

function fetchData(page) {
    const xhr = new XMLHttpRequest();
    xhr.open('GET', `/api/data?page=${page}&size=${pageSize}`, true);
    xhr.onload = function () {
        if (xhr.status === 200) {
            document.getElementById('content').innerHTML = xhr.responseText;
        } else {
            console.error('Error fetching data:', xhr.statusText);
        }
    };
    xhr.onerror = function () {
        console.error('Network error');
    };
    xhr.send();
}

function nextPage() {
    currentPage++;
    fetchData(currentPage);
}

function prevPage() {
    if (currentPage > 1) {
        currentPage--;
        fetchData(currentPage);
    }
}

// 初始加载第一页数据
fetchData(currentPage);

app.get('/api/data', (req, res) => {
    const page = parseInt(req.query.page) || 1;
    const size = parseInt(req.query.size) || 10;
    const startIndex = (page - 1) * size;
    const endIndex = startIndex + size;

    // 假设data是你的数据源
    const paginatedData = data.slice(startIndex, endIndex);
    res.json(paginatedData);
});