Bootstrap DataTable提供的表格樣式是這樣的：

但是如果想實現如圖的效果：

需要在jquery函式中修改成如下：

 $(document).ready(function() {
 $('#dataTables-example').dataTable( {
        "dom": '<"top"fl><"toolbar">rt<"bottom"ip><"clear">'
    } );
$("div.toolbar").html('<select><option>All</option><option>Archive</option><option>No-Archive</option></select>').addClass("select");
} );

其中fl中的f是搜尋框，l是每頁顯示的條數，r暫時還沒發現，t應該是控制格局的，i是表格下面的總資料條數，p是翻頁的按鈕。想起DataTable中有寫到。

如此一來，'<"top"fl><"right"><"toolbar">rt<"bottom"ip><"clear">'的意思是：<top>即表格的上方放置搜尋框和每頁顯示的條數，接著右邊放置我們自定義的東西，如例子中的下拉列表。以此類推。具體DataTable提供給我們的這些配置是怎麼實現還是需要深究，我還不能完全理解這樣的寫法，畢竟我還是菜鳥。

<"xxx">的用法應該是說，建立一個class名為xxx的div，若要在DIV中放東西，就是上面寫的那樣，<"xxx"fl>，要能想象成div跟div的樣子，用起來就會舒服多了

記錄下來，作為筆記之用！