JQuery是一种常用的Javascript库，它极大地简化了前端页面的开发。在JQuery中，我们可以使用一些简单的代码来操作页面元素，其中包括更改背景图像。今天我们重点介绍如何使用JQuery在点击时更改页面的背景图像。

    $(function() {
        // 监听.click()事件
        $(".background-btn").click(function() {
            // 更改页面背景图像
            $("body").css("background-image", "url(image/new-background.jpg)");
        })
    })

在上面的JQuery代码中，我们首先使用 $ 符号来查找 class 为 background-btn 的按钮元素，然后使用 .click() 方法来为这个按钮添加一个点击事件监听器。当用户点击这个按钮时，我们将会通过 .css() 方法来更改 body 元素的样式和背景图像。在这个例子中，我们使用相对路径指定新的背景图像。

在实际的开发中，我们当然可以使用内联样式来更改背景图像。但是在大型项目中，为每个页面单独编写样式是不可维护的，我们需要将背景图像的更改全部放在CSS文件中，这样可以让我们更快地响应变化，缩短开发时间。

    .background-image {
        background-image: url(image/new-background.jpg);
    }

以上是CSS文件中修改背景图像的代码。

总结一下，JQuery是一个功能强大的Javascript库，可以极大地简化前端开发。我们可以使用JQuery来监听按钮点击事件，并且在回调函数中更改页面背景图像。更重要的是，我们可以使用CSS文件来管理大型项目中的背景图像和其他页面元素的样式。通过这种方式，我们可以更好地维护我们的项目。