Question

我正在使用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。它似乎也有效。

以下是我在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，..）来自哪里？

Answer 1

根据website：

DataTables入门就像在网站中包含两个文件，CSS样式和DataTables脚本本身一样简单。

如果您想要DataTables使用的所有样式功能，您应该包含CSS文件。

它还says：

CSS文件实际上是可选的，但它为您的表提供了默认样式，使其看起来很轻松。

javascript会引用CSS类，但如果你没有它们，它就不会应用额外的样式。

Answer 2

只是添加到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;}

我应该导入什么来使用jquery数据表？

2 个答案: