准備工作：
了解DataTables
官方網站：http://www.datatables.net/
簡介：DataTables是一個jQuery的表格插件。這是一個高度靈活的工具，依據的基礎逐步增強，這將增加先進的互動控制，支持任何HTML表格。
主要特點：
- 自動分頁處理
- 即時表格數據過濾
- 數據排序以及數據類型自動檢測
- 自動處理列寬度
- 可通過CSS定制樣式
- 支持隱藏列
- 易用
- 可擴展性和靈活性
- 國際化
- 動態創建表格
- 免費的
| bAutoWidth |
是否啟用自動適應列寬
默認值：True
示例代碼：
"bAutoWidth": false
} );
} );
bDeferRender
是否啟用延遲加載：當你使用AJAX數據源時，可以提升速度。
默認值：False
示例代碼：
var oTable = $('#example').dataTable( {
"sAjaxSource": "sources/arrays.txt",
"bDeferRender": true
} );
} );
bFilter
是否啟用內置搜索功能：可以跨列搜索。
默認值：True
示例代碼：
$('#example').dataTable( {
"bFilter": false
} );
} );
bInfo
是否顯示表格相關信息：例如翻頁信息等。
默認值：True
示例代碼：
$('#example').dataTable( {
"bInfo": false
} );
} );
bJQueryUI
是否啟用 jQuery UI 皮膚插件支持
默認值:False
示例代碼：
$('#example').dataTable( {
"bJQueryUI": true
} );
} );
bLengthChange
是否允許用戶，在下拉列表自定義選擇分頁大小(10, 25, 50 and 100),需要分頁支持
默認值：True
示例代碼：
$('#example').dataTable( {
"bLengthChange": false
} );
} );
bPaginate
是否開啟分頁
默認值：Ture
示例代碼:
$('#example').dataTable( {
"bPaginate": false
} );
} );
是否啟用進度顯示，進度條等等，對處理大量數據很有用處。
默認值：false
示例代碼：
$('#example').dataTable( {
"bProcessing": true
} );
} );
bScrollInfinite
是否開啟內置滾動條，並且顯示所有數據
默認值：fasle
示例代碼：
$('#example').dataTable( {
"bScrollInfinite": true,
"bScrollCollapse": true,
"sScrollY": "200px"
} );
} );
bServerSide
是否啟用服務器處理數據源，必須sAjaxSource指明數據源位置
默認值：False
示例代碼：
$(document).ready( function () {
$('#example').dataTable( {
"bServerSide": true,
"sAjaxSource": "xhr.php"
} );
} );
bSort
是否開啟列排序功能，如果想禁用某一列排序，可以在每列設置使用bSortable參數
默認值：True
示例代碼：
$('#example').dataTable( {
"bSort": false
} );
} );
bSortClasses
不清楚是做什么用的，如果處理大量數據時，必須關閉（有人知道嗎？）
默認值：False
示例代碼：
$('#example').dataTable( {
"bSortClasses": false
} );
} );
是否開啟cookies保存當前狀態信息
默認值：false
示例代碼：
$('#example').dataTable( {
"bStateSave": true
} );
} );
sScrollX
是否開啟水平滾動條
默認值：空 （字符串類型）
示例代碼：
$('#example').dataTable( {
"sScrollX": "100%",
"bScrollCollapse": true
} );
} );
sScrollY
是否開啟垂直滾動條，滾動條大小受限於Datatable的高度大小
默認值：空 （字符串類型）
示例代碼：
$('#example').dataTable( {
"sScrollY": "200px",
"bPaginate": false
} );
} );