复杂的表头高级初始化示例 Datatables中文网

Name	HR Information		Contact
Name	Position	Salary	Office	Extn.	E-mail
Name	Position	Office	Age	Start date	Salary
Tiger Nixon	System Architect	Edinburgh	61	2011/04/25	$320,800
Garrett Winters	Accountant	Tokyo	63	2011/07/25	$170,750
Garrett Winters	Accountant	Tokyo	63	2011/07/25	$170,750
Garrett Winters	Accountant	Tokyo	63	2011/07/25	$170,750
Garrett Winters	Accountant	Tokyo	63	2011/07/25	$170,750
Garrett Winters	Accountant	Tokyo	63	2011/07/25	$170,750
Garrett Winters	Accountant	Tokyo	63	2011/07/25	$170,750
Garrett Winters	Accountant	Tokyo	63	2011/07/25	$170,750
Ashton Cox	Junior Technical Author	San Francisco	66	2009/01/12	$86,000
Cedric Kelly	Senior Javascript Developer	Edinburgh	22	2012/03/29	$433,060
Airi Satou	Accountant	Tokyo	33	2008/11/28	$162,700
Brielle Williamson	Integration Specialist	New York	61	2012/12/02	$372,000
Herrod Chandler	Sales Assistant	San Francisco	59	2012/08/06	$137,500

javascript
html

$(document).ready(function() {
    $('#example').dataTable({
        "columnDefs": [{
            "visible": false,
            "targets": -1
        }]
    });
});

<table id="example" class="display" cellspacing="0" width="100%">
<thead>
    <tr>
        <th rowspan="2">Name</th>
        <th colspan="2">HR Information</th>
        <th colspan="3">Contact</th>
    </tr>
    <tr>
        <th>Position</th>
        <th>Salary</th>
        <th>Office</th>
        <th>Extn.</th>
        <th>E-mail</th>
    </tr>
</thead>

<tfoot>
<tr>
    <th>Name</th>
    <th>Position</th>
    <th>Office</th>
    <th>Age</th>
    <th>Start date</th>
    <th>Salary</th>
</tr>
</tfoot>

<tbody>
<tr>
    <td>Tiger Nixon</td>
    <td>System Architect</td>
    <td>Edinburgh</td>
    <td>61</td>
    <td>2011/04/25</td>
    <td>$320,800</td>
</tr>
<tr>
    <td>Garrett Winters</td>
    <td>Accountant</td>
    <td>Tokyo</td>
    <td>63</td>
    <td>2011/07/25</td>
    <td>$170,750</td>
</tr>
<tr>
    <td>Ashton Cox</td>
    <td>Junior Technical Author</td>
    <td>San Francisco</td>
    <td>66</td>
    <td>2009/01/12</td>
    <td>$86,000</td>
</tr>
<tr>
    <td>Cedric Kelly</td>
    <td>Senior Javascript Developer</td>
    <td>Edinburgh</td>
    <td>22</td>
    <td>2012/03/29</td>
    <td>$433,060</td>
</tr>
<tr>
    <td>Airi Satou</td>
    <td>Accountant</td>
    <td>Tokyo</td>
    <td>33</td>
    <td>2008/11/28</td>
    <td>$162,700</td>
</tr>
<tr>
    <td>Brielle Williamson</td>
    <td>Integration Specialist</td>
    <td>New York</td>
    <td>61</td>
    <td>2012/12/02</td>
    <td>$372,000</td>
</tr>
<tr>
    <td>Herrod Chandler</td>
    <td>Sales Assistant</td>
    <td>San Francisco</td>
    <td>59</td>
    <td>2012/08/06</td>
    <td>$137,500</td>
</tr>
</tbody>
</table>

http://datatables.net/examples/advanced_init/complex_header.html
Translation from DataTables.net, with permission