DataTables 2 的新功能
DataTables 2.1 是 2.x 系列的第一个次要版本，引入了许多新功能，并解决了 2.0 发布后出现的一些问题。
本文档是有关 DataTables 2.1 发布的多个相关文档的一部分。
布局
DataTables 2 中的一个重大新功能是引入了 layout，它取代了旧的 dom 选项，使用起来更容易。根据反馈，2.1 现在将位于同一布局单元格（即数组）中的功能放在同一行上。同样，位于全宽单元格（例如，仅 top 或 bottom）中的项目在行上均匀分布。
要查看实际效果，请考虑以下表格。
| 姓名 | 办公室 | 开始日期 | 工资 |
|---|---|---|---|
| Tiger Nixon | Edinburgh | 2011-04-25 | 320800 |
| Garrett Winters | Tokyo | 2011-07-25 | 170750 |
| Ashton Cox | San Francisco | 2009-01-12 | 86000 |
| Cedric Kelly | Edinburgh | 2012-03-29 | 433060 |
| Airi Satou | Tokyo | 2008-11-28 | 162700 |
| Brielle Williamson | New York | 2012-12-02 | 372000 |
| Herrod Chandler | San Francisco | 2012-08-06 | 137500 |
| Rhona Davidson | Tokyo | 2010-10-14 | 327900 |
| Colleen Hurst | San Francisco | 2009-09-15 | 205500 |
| Sonya Frost | Edinburgh | 2008-12-13 | 103600 |
| Jena Gaines | London | 2008-12-19 | 90560 |
| Quinn Flynn | Edinburgh | 2013-03-03 | 342000 |
| Charde Marshall | San Francisco | 2008-10-16 | 470600 |
| Haley Kennedy | London | 2012-12-18 | 313500 |
| Tatyana Fitzpatrick | London | 2010-03-17 | 385750 |
| Michael Silva | London | 2012-11-27 | 198500 |
| Paul Byrd | New York | 2010-06-09 | 725000 |
| Gloria Little | New York | 2009-04-10 | 237500 |
| Bradley Greer | London | 2012-10-13 | 132000 |
| Dai Rios | Edinburgh | 2012-09-26 | 217500 |
| Jenette Caldwell | New York | 2011-09-03 | 345000 |
| Yuri Berry | New York | 2009-06-25 | 675000 |
| Caesar Vance | New York | 2011-12-12 | 106450 |
| Doris Wilder | Sydney | 2010-09-20 | 85600 |
| Angelica Ramos | London | 2009-10-09 | 1200000 |
| Gavin Joyce | Edinburgh | 2010-12-22 | 92575 |
| Jennifer Chang | Singapore | 2010-11-14 | 357650 |
| Brenden Wagner | San Francisco | 2011-06-07 | 206850 |
| Fiona Green | San Francisco | 2010-03-11 | 850000 |
| Shou Itou | Tokyo | 2011-08-14 | 163000 |
| Michelle House | Sydney | 2011-06-02 | 95400 |
| Suki Burks | London | 2009-10-22 | 114500 |
| Prescott Bartlett | London | 2011-05-07 | 145000 |
| Gavin Cortez | San Francisco | 2008-10-26 | 235500 |
| Martena Mccray | Edinburgh | 2011-03-09 | 324050 |
| Unity Butler | San Francisco | 2009-12-09 | 85675 |
| Howard Hatfield | San Francisco | 2008-12-16 | 164500 |
| Hope Fuentes | San Francisco | 2010-02-12 | 109850 |
| Vivian Harrell | San Francisco | 2009-02-14 | 452500 |
| Timothy Mooney | London | 2008-12-11 | 136200 |
| Jackson Bradshaw | New York | 2008-09-26 | 645750 |
| Olivia Liang | Singapore | 2011-02-03 | 234500 |
| Bruno Nash | London | 2011-05-03 | 163500 |
| Sakura Yamamoto | Tokyo | 2009-08-19 | 139575 |
| Thor Walton | New York | 2013-08-11 | 98540 |
| Finn Camacho | San Francisco | 2009-07-07 | 87500 |
| Serge Baldwin | Singapore | 2012-04-09 | 138575 |
| Zenaida Frank | New York | 2010-01-04 | 125250 |
| Zorita Serrano | San Francisco | 2012-06-01 | 115000 |
| Jennifer Acosta | Edinburgh | 2013-02-01 | 75650 |
| Cara Stevens | New York | 2011-12-06 | 145600 |
| Hermione Butler | London | 2011-03-21 | 356250 |
| Lael Greer | London | 2009-02-27 | 103500 |
| Jonas Alexander | San Francisco | 2010-07-14 | 86500 |
| Shad Decker | Edinburgh | 2008-11-13 | 183000 |
| Michael Bruce | Singapore | 2011-06-27 | 183000 |
| Donna Snider | New York | 2011-01-25 | 112000 |
这里，最上面的行 (top1) 只有一个 Start 单元格，您将看到三个 功能元素 在同一行上。下一行也有三个功能元素，但由于它是一行“完整”的行，因此它们均匀分布。此新增功能使得在一行上放置多个项目变得更加容易，同时保留了 layout 的易用性。
您可以在 此处找到布局选项的更完整的示例。
ID 和类名
2.1 还引入了设置由 layout 创建的行和单元格的类名和 ID 的功能。有关详细信息，请参阅 此示例 以及 layout 文档。
表格宽度
与布局相关，如果未找到 style="width: ... 或 width 属性，DataTables 现在会自动将表格宽度设置为 100%。我遇到的几乎所有表格都使用 100% 的宽度，但从 CSS 中读取相对值却令人惊讶地困难，因此 DataTables 现在将做出此假设，以帮助创建简洁明了的标记。
数据类型检测和重音字符
DataTables 2.1 对数据类型检测的工作方式进行了重大改进。以前，使用一个函数，如果列中所有数据点都通过了该函数的测试，则该列将被分配该数据类型。但是，这会导致类似数据和空数据出现问题 - 例如，包含 FontAwesome 图标的列可能会被发现为数值，因为 HTML 被剥离，而数值数据类型允许空单元格！
在 2.1 中，类型检测函数现在可以指定 oneOf 和 allOf 函数。列中至少一个数据点必须通过新的 oneOf 函数，而 allOf 与以前的行为相同。向后兼容性仍然得到保证，因为它支持单个函数。这允许收紧数据类型测试，这些测试已得到实施。
重音字符的自动排序
作为类型检测改进的一部分，2.1 引入了一种新的数据类型：string-utf8。它不同于 string，如果字符串包含 ASCII 范围之外的字符，则会匹配。此新数据类型将使用 localeCompare 对数据进行排序，从而实现对重音字符的正确排序。它不会用于包含仅 ASCII 字符的列，因为它比简单字符串比较慢。
Bulma 1
Bulma 是一个流行的 CSS 框架，用于构建现代 Web 应用程序和网站，长期以来一直受到 DataTables 的支持。今年早些时候，Bulma 发布了 1.0（对该团队表示衷心的祝贺），DataTables 2.1 已更新为完全支持新版本。Bulma 在 1.0 中还引入了暗色模式，现在 DataTables 也完全支持暗色模式。DataTables 示例 都可以选择“Bulma”作为样式框架，并且您可以根据需要在浅色模式和暗色模式之间切换。
这将我们支持的框架中的暗色模式支持扩展到三个：DataTables 默认值、Bootstrap 5 和 Bulma 1。
使用方法
直接在浏览器中加载 DataTables 时，它会自动查找某些库（例如 Moment.js 和 Luxon），并在可用时使用它们。这在 ESM 环境中是不可能的，因为库不会附加到全局作用域。在这种情况下，您需要将外部库告诉 DataTables，现在可以使用 DataTable.use() 静态方法来实现。
例如，以下代码与 此示例 相同，但适用于 ESM（然后通过捆绑器（如 Vite 或 Webpack）进行转换）。
import moment from 'moment';
import DataTable from 'datatables.net';
// Tell DataTables that it can use Moment for date formatting
DataTable.use(moment, 'moment');
// Tell DataTables what date format you want to look for in the HTML data
DataTable.datetime('D MMM YYYY');
// Initialise DataTables
new DataTable('#example');
以及更多...
2.1 还包含其他一些较小的新增功能 - 这些只是“重磅”功能。有关 DataTables 2.1 中新增功能和更改的完整详细信息，请参阅 发行说明。