我應該導入什麼來使用jquery數據表？

-1

我正在使用jQuery數據表https://www.datatables.net/。我只是想知道是否必須導入//cdn.datatables.net/1.10.11/css/jquery.dataTables.min.css？我剛剛進口https://cdn.datatables.net/1.10.11/js/jquery.dataTables.min.js。它似乎也起作用。我應該導入什麼來使用jquery數據表？

以下是我的網頁在Firefox上的一段源代碼。

<table id="reportsTable" class="table dataTable no-footer" role="grid" aria-describedby="reportsTable_info"> 
    <thead> 
    <tr role="row"> 
     <th class="col-md-5 sorting_asc" tabindex="0" aria-controls="reportsTable" rowspan="1" colspan="1" aria-sort="ascending" aria-label="Report Name: activate to sort column descending" style="width: 655px;">Report Name</th> 
     <th class="col-md-2 sorting" tabindex="0" aria-controls="reportsTable" rowspan="1" colspan="1" aria-label="Created Date: activate to sort column ascending" style="width: 240px;">Created Date</th> 
     <th class="col-md-2 sorting" tabindex="0" aria-controls="reportsTable" rowspan="1" colspan="1" aria-label="Last Modified Date: activate to sort column ascending" style="width: 240px;">Last Modified Date</th> 
     <th class="col-md-2 thead-schedule sorting_disabled" rowspan="1" colspan="1" aria-label="Scheduling" style="width: 240px;">Scheduling</th> 
     <th class="col-md-1 sorting_disabled" rowspan="1" colspan="1" aria-label="" style="width: 101px;"></th> 
    </tr> 
    </thead> 
    <tbody id="reportTableBody"> 
    <tr class="report-entry odd" role="row"> 
     <td class="sorting_1"><a href="reports/135">dddd123678</a></td> 
     <td> 
     <time>4/13/2016, 14:41</time> 
     </td> 
     <td> 
     <time>4/14/2016, 14:02</time> 
     </td> 
    </tr> 
    </tbody> 
</table>

哪裏CSS類（如scending，sorting_asc，reportsTable_info，..）從何而來？

來源

2016-04-14 BAE

目前還不清楚你在說什麼。 *輸出的html包含在css文件中定義的css標記。*你能分享那個輸出代碼嗎？ – Aziz

@Aziz我的問題是：爲什麼一些css標籤在輸出html文件中生成，但只有js文件導入和（'#example'）.DataTable（）被調用。 – BAE

按照website：

開始使用數據表是包括在您的網站的兩個文件，將CSS樣式和數據表腳本本身一樣簡單。

如果你想要DataTables使用的所有樣式功能，你應該包含CSS文件。

它還says：

CSS文件實際上是可選的，但它提供了默認樣式表中，以使它看起來很好用最小的努力。

JavaScript將引用CSS類，但如果您沒有它們，它將不會應用其他樣式。

來源

2016-04-14 19:13:02 Nived

如果僅輸入js，它可以提供默認樣式？ – BAE

如果您使用開發人員工具來檢查這些類，則可以看到，如果您沒有CSS，它們可能不會執行任何操作，它只是使用基本的CSS樣式，而不是CSS文件使用的任何樣式。 – Nived

我只導入了js文件，但輸出的html包含css文件中定義的css標籤。也許有些失蹤。我很困惑。 – BAE

只是添加到Nived。一般來說，當添加jQuery庫時，.js文件通常會引用css中的類標籤。這意味着你應該使用包含的.css文件。最好的部分是，如果你想在你加載初始文件後只需要包含任何css定義的樣式。

例如：

<link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.11/css/jquery.dataTables.min.css"> 

.td{font-size: 12px;}

來源

2016-04-14 19:17:01

我只導入了js文件，但輸出的html包含css文件中定義的css標籤。例如，sorting_asc。我還發現一些沒有在css文件中定義的css標籤，比如sorting_disabled。也許有些失蹤。我很困惑。 – BAE

@BAE，使用'link'標籤導入CSS文件，標籤放置在html的'head'部分，正如答案所示。 –

我應該導入什麼來使用jquery數據表？

回答

相關問題