在web開發(fā)中，數(shù)據(jù)表格是一個非常常見的組件。jQuery DataTables是一個非常流行且易于使用的庫，用于顯示和操作數(shù)據(jù)表格。其中一個非常有用的功能就是合計（Summation）功能。 當在表格中顯示數(shù)值數(shù)據(jù)時，我們經(jīng)常需要對數(shù)據(jù)進行合計。在jQuery DataTables中，合計功能可以通過使用插件來實現(xiàn)。 首先，將以下代碼添加到HTML文件中：

<!--引用jQuery和jQuery DataTables庫-->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" >
<!--引用jQuery DataTables合計插件-->
<script src="https://cdn.datatables.net/plug-ins/1.10.25/api/sum().js"></script>

接下來，在初始化數(shù)據(jù)表格的代碼中添加以下內(nèi)容：

$('table').DataTable({
"footerCallback": function ( row, data, start, end, display ) {
var api = this.api(), data;
// Remove the formatting to get integer data for summation
var intVal = function ( i ) {
return typeof i === 'string' ?
i.replace(/[\$,]/g, '')*1 :
typeof i === 'number' ?
i : 0;
};
// Total over all pages
total = api
.column( 4 )
.data()
.reduce( function (a, b) {
return intVal(a) + intVal(b);
}, 0 );
// Update footer
$( api.column( 4 ).footer() ).html(
'$'+total.toFixed(2)
);
}
});

上述代碼中，我們先定義了一個函數(shù)intVal用于將單元格的字符串數(shù)據(jù)轉(zhuǎn)換為數(shù)字。然后我們通過使用reduce()方法，將每個單元格的值相加得到總和。最后我們將總和更新到表格的footer中。 這里的參數(shù)4表示第5列數(shù)據(jù)需要被合計，你可以根據(jù)你的表格中的數(shù)據(jù)來調(diào)整參數(shù)。 現(xiàn)在我們已經(jīng)成功添加了jQuery DataTables合計插件，可以輕松地合計數(shù)據(jù)表格中的數(shù)據(jù)。這為我們的web開發(fā)工作帶來了巨大的便利。