datatable的简单使用

1、引入datatable的样式及js，因为datatable是基于jquery的所以需要先引入jquery

2、<!-- DataTables CSS -->

<link rel="stylesheet" type="text/css" href="${path}/media/css/jquery.dataTables.css">

引入table的样式文件，可以直接下载放在本项目中也可以直接引用外部css

3、首先引入jquery，然后引入需要使用的js文件，顺序不可以颠倒

<!-- jQuery -->

<script type="text/javascript" charset="utf8" src="${path}/media/js/jquery.js"></script> 

<!-- DataTables -->

<script type="text/javascript" charset="utf8" src="${path}/media/js/jquery.dataTables.js"></script>

1、所有的样式及js就这么多，datatable是先加载内容后渲染的，所以现在需要创建table。

2、<table id="table1" class="display">

   <thead>

       <tr>

           <th>序号</th>

           <th>名称</th>

       </tr>

   </thead>

   <tbody>

       <tr>

           <td>1</td>

           <td>张三</td>

       </tr>

       <tr>

           <td>2</td>

           <td>李四</td>

       </tr>

   </tbody>

</table>

3、<!--第三步：初始化Datatables-->

$(document).ready( function () {

   $('#table1').DataTable();

} );

4、DataTable中处理数据有两种，逻辑分页及物理分页，在数据量确定不会增长且数量小于10k的时候可以使用逻辑分页，及一次性将数据加载，使用浏览器分页，反之则考虑使用物理分页；