mysql 分页查询web_分页查询的入门打开方式（JavaWeb）

技术涵盖(JavaWeb、HTML、Ajax、JQuery、Bootstrap )

接触这一部分知识的时候，我们经常会做一些小Demo来练手，不可避免的就需要接触到一定量的数据，我们常常需要将数据从数据库中回显到页面中，但是随着数据量的增加，如果不对数据的查询或者显示进行一定的处理，那么会出现各式各样的问题，例如：客户端：如果数据同时展示在一个页面中，用户体验效果比较差，操作也是极其不方便

服务端：一次请求，查询到所有的数据，数据传输量过大或导致超时或者响应速度变慢，对于服务器的负荷过大

分页方式

前端 JS 分页 - 不推荐

我们可以请求获取到所有数据后，使用 JavaScript 来进行数据分页显示，单纯的在数据的显示这一方面看确实美观了很多，并且这种分页方式要比后端分页简单很多

但是如果存在一定数据量的情况下，这种方式着实有一些尴尬，他并没有解决了我们服务端的任何问题，反而会让用户在等待响应数据耗时过多，体验不佳，不过它仍然是一种分页方式

在这里我们重点讲解后端分页，所以我们简单的演示一下，也把代码贴出来，由于我们 html 中使用的是 BootStrap 前端框架，所以我们借助了 bootstrap-table 这个前端分页插件

前端 JS 分页 演示代码：


用户信息管理系统

​

​

用户信息列表

​

​

td, th {

text-align: center;

}

​

$(function () {

$("#userInfo_table").bootstrapTable({

url: 'user/userList',

toolbar: '#toolbar',

method: 'GET',

striped: true, //是否显示行间隔色 cache: false, //是否使用缓存 toolbarAlign: "right", //工具栏对齐方式 sidePagination: "client", //分页方式：client客户端分页，server服务端分页 search: true, //是否显示表格搜索，此搜索是客户端搜索，不会进服务端 uniqueId: "id",

pageNumber: 1, //初始化加载第一页 pageSize: 10, //每页的记录行数 pageList: [5, 10, 15, 20], //可供选择的每页的行数 pagination: true, // 是否分页 sortable: true, // 是否启用排序 sortOrder: "asc", //排序方式 showColumns: true, //是否显示列选择按钮 showRefresh: true, //是否显示刷新按钮 clickToSelect: true, //是否启用点击选中行 // height: 500, //行高 showToggle: true, //是否显示详细视图和列表视图的切换按钮 cardView: false, //是否显示详细视图 detailView: false, //是否显示父子表 queryParamsType: '',//设置请求参数格式 queryParams: function queryParams(params) { //设自定义查询参数 /*请求远程数据时，可以通过修改queryParams来发送其他参数。如果queryParamsType = 'limit'，params对象包含：limit，offset，search，sort，order。否则，它包含：pageSize，pageNumber，searchText，sortName，sortOrder。返回false停止请求。默认： function(params) { return params }*/

return params;

},

​

columns: [{

title: "全选",

field: "select",

checkbox: true,

width: 20, //宽度 align: "center", //水平 valign: "middl