Html 如何将大量表格行划分为部分或滑块

我有一个从包含1000多行的大表中获取数据的方法，如何将此报告分成多个部分或类似滑块的邮箱。

检查此方法：

下面是一个演示：

库

$(document).ready(function() {
    $('table.display').dataTable();
} );

div.dataTables_wrapper {
        margin-bottom: 3em;
    }

JS

$(document).ready(function() {
    $('table.display').dataTable();
} );

div.dataTables_wrapper {
        margin-bottom: 3em;
    }

CSS

$(document).ready(function() {
    $('table.display').dataTable();
} );

div.dataTables_wrapper {
        margin-bottom: 3em;
    }

HTML

<table id="" class="display" cellspacing="0" width="100%">
        <thead>
            <tr>
                <th>Name</th>
                <th>Position</th>
                <th>Office</th>
                <th>Age</th>
                <th>Salary</th>
            </tr>
        </thead>

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

        <tbody>
            <tr>
            <td>Jena Gaines</td>
            <td>Office Manager</td>
            <td>London</td>
            <td>30</td>
            <td>$90,560</td>
        </tr>
        <tr>
            <td>Haley Kennedy</td>
            <td>Senior Marketing Designer</td>
            <td>London</td>
            <td>43</td>
            <td>$313,500</td>
        </tr>
        <tr>
            <td>Tatyana Fitzpatrick</td>
            <td>Regional Director</td>
            <td>London</td>
            <td>19</td>
            <td>$385,750</td>
        </tr>
        <tr>
            <td>Michael Silva</td>
            <td>Marketing Designer</td>
            <td>London</td>
            <td>66</td>
            <td>$198,500</td>
        </tr>
        <tr>
            <td>Bradley Greer</td>
            <td>Software Engineer</td>
            <td>London</td>
            <td>41</td>
            <td>$132,000</td>
        </tr>
        <tr>
            <td>Angelica Ramos</td>
            <td>Chief Executive Officer (CEO)</td>
            <td>London</td>
            <td>47</td>
            <td>$1,200,000</td>
        </tr>
        <tr>
            <td>Suki Burks</td>
            <td>Developer</td>
            <td>London</td>
            <td>53</td>
            <td>$114,500</td>
        </tr>
        <tr>
            <td>Prescott Bartlett</td>
            <td>Technical Author</td>
            <td>London</td>
            <td>27</td>
            <td>$145,000</td>
        </tr>
        <tr>
            <td>Timothy Mooney</td>
            <td>Office Manager</td>
            <td>London</td>
            <td>37</td>
            <td>$136,200</td>
        </tr>
        <tr>
            <td>Bruno Nash</td>
            <td>Software Engineer</td>
            <td>London</td>
            <td>38</td>
            <td>$163,500</td>
        </tr>
        <tr>
            <td>Hermione Butler</td>
            <td>Regional Director</td>
            <td>London</td>
            <td>47</td>
            <td>$356,250</td>
        </tr>
        <tr>
            <td>Lael Greer</td>
            <td>Systems Administrator</td>
            <td>London</td>
            <td>21</td>
            <td>$103,500</td>
        </tr>
    </tbody>
</table>

名称
位置
办公室
年龄
薪水
名称
位置
办公室
年龄
薪水
杰娜·盖恩斯
办公室经理
伦敦
30
$90,560
海莉·肯尼迪
高级市场设计师
伦敦
43
$313,500
塔蒂亚娜·菲茨帕特里克
区域主任
伦敦
19
$385,750
迈克尔·席尔瓦
营销设计师
伦敦
66
$198,500
布拉德利·格里尔
软件工程师
伦敦
41
$132,000
当归
首席执行官（CEO）
伦敦
47
$1,200,000
苏基伯克斯
开发商
伦敦
53
$114,500
普雷斯科特·巴特利特
技术作者
伦敦
27
$145,000
蒂莫西·穆尼
办公室经理
伦敦
37
$136,200
布鲁诺·纳什
软件工程师
伦敦
38
$163,500
赫敏·巴特勒
区域主任
伦敦
47
$356,250
拉尔·格里尔
系统管理员
伦敦
21
$103,500

发现它完全在地图上