分页导航DOM更新实践：JavaScript与jQuery的结合使用

// 确保DOM完全加载完毕
$(document).ready(function() {
    // 为分页导航的上一页按钮添加点击事件
    $('#previous-page').on('click', function() {
        var currentPage = parseInt($('#current-page').text(), 10);
        if (currentPage > 1) {
            // 更新当前页面的数字
            $('#current-page').text(currentPage - 1);
            // 可以在这里添加更多的逻辑，例如发送AJAX请求获取数据等
        }
    });
 
    // 为分页导航的下一页按钮添加点击事件
    $('#next-page').on('click', function() {
        var currentPage = parseInt($('#current-page').text(), 10);
        var totalPages = parseInt($('#total-pages').text(), 10);
        if (currentPage < totalPages) {
            $('#current-page').text(currentPage + 1);
            // 可以在这里添加更多的逻辑，例如发送AJAX请求获取数据等
        }
    });
});

这段代码使用jQuery确保了在文档加载完成后绑定了点击事件。使用parseInt确保页码是正确的整数格式，并且在用户点击上一页或下一页时更新页码。这是一个简单的示例，实际应用中可能需要更复杂的逻辑来处理数据和用户界面的更新。