DataTable 是一個非常流行的 jQuery 插件,可以很方便地操作表格數據。當我們想將表格數據展示在頁面上時,通常可以利用 DataTable,它還可以通過 JSON 字符串的形式傳遞數據。
JSON 字符串是一種輕量級的數據交換格式,其結構清晰、易讀、易解析。在 DataTable 中,我們可以在客戶端通過data
屬性將 JSON 格式的數據傳遞給 DataTable,讓其自動填充表格。
JSON 格式的數據通常有以下基本結構:
{ "data": [ { "id": "1", "name": "John", "age": "25", "email": "john@gmail.com" }, { "id": "2", "name": "Mary", "age": "30", "email": "mary@gmail.com" }, { "id": "3", "name": "Bob", "age": "35", "email": "bob@gmail.com" } ] }
以上是一個典型的 JSON 格式的數據,其中包含一個數組data
,每個數組元素都是一個包含id
、name
、age
和email
屬性的對象。
在 DataTable 中,我們可以通過以下代碼將以上 JSON 格式的數據傳遞給 DataTable:
$(document).ready(function() { $('#example').DataTable({ "ajax": "data.json", "columns": [ { "data": "id" }, { "data": "name" }, { "data": "age" }, { "data": "email" } ] }); });
在上述代碼中,我們通過ajax
屬性將data.json
文件中的數據加載到 DataTable 中。接著我們定義了四個列,分別對應id
、name
、age
和email
的值。
總之,在 DataTable 中使用 JSON 格式的數據非常方便,可以讓我們快速地將數據持久化到頁面中。