在前端數據表格的開發中，jQuery庫是應用最廣泛的 JavaScript 庫之一。而其中的DataTables插件則是使用較多的數據表格插件之一。和其它表格插件不同的是，DataTables 提供了各種實用的方法和 API，使得開發者們可以很容易地對表格進行自定義和擴展，而其中之一就是導出數據的功能。

下面我們就簡要介紹下如何使用 DataTables 導出表格數據。

首先，我們需要在 HTML 文件中引入 DataTables 的樣式和腳本文件。

<link rel="stylesheet" >
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>

接著，我們需要在 JavaScript 文件中初始化 DataTables。

$(document).ready(function() {
$('#example').DataTable();
});

上述代碼中，`#example` 是我們要使用 DataTables 的表格元素的 ID。

要使用 DataTables 導出數據的功能，我們需要引入一個額外的 JS 庫，即ButtonsJS 庫。同樣，我們還需要用到一些 CSS 樣式文件，如Buttons樣式文件。

我們還需要定義一個“導出按鈕”的元素。這里我們使用一個 `<button>` 元素來作為導出按鈕。當我們點擊這個按鈕時，將會觸發導出數據的操作。

<button id="export">Export</button>

最后，我們需要在 JavaScript 文件中編寫導出數據的代碼。

$(document).ready(function() {
var table = $('#example').DataTable();
$('#export').on('click', function() {
$.fn.dataTable.Buttons.defaults.dom.button.className = 'btn btn-primary';
$.fn.dataTable.Buttons.defaults.exportOptions.columns = ':visible';
table.buttons().container().appendTo($('.col-sm-6:eq(0)', table.table().container()));
table.buttons().exportData({
format: {
body: function(data, row, column, node) {
if (typeof data === 'string' && data.indexOf('<') !== -1) {
data = data.replace(/</g, '&lt;');
}
return data;
}
}
});
});
});

上述代碼中，我們首先獲取了 DataTables 的實例（即 `table` 變量），接著定義了一個“導出按鈕”點擊事件的回調函數。在回調函數中，我們使用 `table.buttons()` 方法來創建導出數據的按鈕，并將其添加到表格容器中；然后使用 `table.buttons().exportData()` 方法來導出數據。

導出數據的格式是可以自定義的。在上述代碼中，我們使用了 `format.body` 屬性來指定導出數據時對表格單元格中的特殊字符進行轉義。

到此，我們就成功地使用 DataTables 導出了表格數據。