列优先级

响应式将会自动隐藏表格中的列，以使表格水平适合于给定的空间。这意味着可以编写一个 HTML 表格，并且将其以美观的形式显示在台式机、平板电脑和移动网页上，而无需修改表格。

当响应式从显示中移除列时，它会从右到左这样做（即首先移除最右边的列）。虽然这是默认行为，但你可能希望将你自己的列可见优先级分配给列，告诉 Responsive 在其他列之前移除哪些列。例如，如果最右边的列包含操作按钮（编辑/删除）或包含特别重要的信息，这可能会特别有用。

可以以下方式分配响应式表格中列的可见优先级

• 使用 columns.responsivePriority 初始化选项
• 列标题单元格的 HTML 标记中的 data-priority 选项。

优先级顺序

响应式中的优先级顺序是一个数字值，其中较低的值等于较高的优先级。例如，优先级为 2 的列将在显示中优先于优先级为 1 的列移除。

列自动分配优先级值为 10,000，除非另有配置，否则使用该值。如果多列共享相同的优先级值，则最右边的列将最先被移除。

配置选项

可以使用 columns.responsivePriority 选项设置优先级顺序，该选项可以定义在 columns 或 columnDefs DataTables 配置数组中。考虑以下事项

$('#myTable').DataTable( {
    responsive: true,
    columnDefs: [
        { responsivePriority: 1, targets: 0 },
        { responsivePriority: 2, targets: -1 }
    ]
} );

此处，最左边的列（target:0）被分配了 1 的优先级，而最右边的列（target:-1）被分配了 2 的优先级。表中的所有其他列都将使用默认优先级 10,000，因此将在这两个列之前被移除。随着表格变窄，最终只会显示第一列。

优先级数据属性

还可以使用 HTML 中的 data-* 属性分配优先级。这是一种在 HTML 和 Javascript 之间传递信息的特别方便的方法，因为无需指定额外的配置选项。只需向列标题单元格添加 data-priority 属性，其值表示要为该列分配的优先级。

考虑以下表格

<table id="example" class="display nowrap" width="100%">
    <thead>
        <tr>
            <th data-priority="1">First name</th>
            <th>Last name</th>
            <th>Position</th>
            <th>Office</th>
            <th>Age</th>
            <th>Start date</th>
            <th>Salary</th>
            <th>E-mail</th>
            <th data-priority="2">Extn.</th>
        </tr>
    </thead>
    <tbody>
        ...
    </tbody>
</table>

这完全匹配上面给出的 Javascript 示例 - 最左边的列优先级为 1，最右边的优先级为 2，所有其他列的默认优先级。