datatables 是一種基于 jQuery 庫的插件，可以在 HTML 表格中添加額外的交互功能，如排序、過濾和分頁等。其中加載 JSON 數據作為數據源也是常用的一種方式。
在使用 datatables 加載遠程 JSON 數據之前，需要先在 HTML 頁面引入必要的文件。這些文件主要包括 jQuery 庫、datatables 庫以及 JSON 數據的后臺服務。
<head> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <link rel="stylesheet"> <script src="https://cdn.bootcdn.net/ajax/libs/datatables/1.10.21/js/jquery.dataTables.min.js"></script> </head>
接下來，在 HTML 頁面中添加一個表格元素，設置 ID 屬性，方便在 JavaScript 代碼中進行操作。同時，在 JavaScript 代碼中，設置 datatables 的參數，并指定 JSON 數據的 URL 地址。
<table id="mytable"></table>
<script>
$(document).ready(function() {
$('#mytable').DataTable({
"ajax": "http://localhost:8888/data.json"
});
});
</script>其中，"ajax" 參數用于指定 JSON 數據的 URL 地址。當頁面加載后，datatables 會異步請求該 URL 的 JSON 數據，并自動將數據加載到 HTML 表格中。
使用 datatables 加載 JSON 數據可以方便地展示并操作 JSON 數據，同時也可以提高用戶體驗，增強頁面交互效果。