Datatables是一款功能強大的表格插件,它可以輕松地處理復雜的表格數據并提供靈活豐富的配置選項。除此之外,Datatables還提供了多種導出選項,其中導出為json格式是比較常用的一種。本文將介紹如何使用Datatables導出json格式的表格數據。
// 定義Datatables實例 var table = $("#example").DataTable({ "ajax": "data.json", // 加載數據 "columns": [ // 定義列 { "data": "name" }, { "data": "position" }, { "data": "office" }, { "data": "salary" }, { "data": "start_date" }, { "data": "end_date" } ] }); // 導出為json格式 $("#export_json").on("click", function() { var jsonData = table.rows().data().toArray(); // 獲取表格數據 var json = JSON.stringify(jsonData); // 將表格數據轉換為json格式 exportData("data.json", json); // 下載json文件 }); // 導出數據 function exportData(filename, data) { var blob = new Blob([data], {type: "octet/stream"}); // 創建二進制對象表示數據 var url = window.URL.createObjectURL(blob); // 創建URL指向blob對象 var a = document.createElement("a"); // 創建a標簽 a.href = url; a.download = filename; document.body.appendChild(a); // 將a標簽添加到body元素中 a.click(); // 觸發單擊事件 document.body.removeChild(a); // 將a標簽從body元素中移除 window.URL.revokeObjectURL(url); // 銷毀URL對象 }
以上代碼為導出json格式的核心代碼,通過調用Datatables提供的API獲取表格數據,并使用JavaScript的JSON.stringify()方法將數據轉換為json格式,最后通過自定義的exportData()方法進行下載。
總之,Datatables提供了眾多強大的功能,其中導出數據是用來將表格數據以各種格式下載到本地的非常實用的功能之一。通過上述代碼,我們可以輕松地實現將表格數據導出為json格式,更多的導出方式也不難實現。