JSON（JavaScript Object Notation）是一種輕量級的數據交換格式，常用于前端和后端數據交互。在JSON中，可以通過數組、對象、字符串、數字和布爾值等多種類型來表示數據。本文將介紹如何使用JSON來編寫表格。

{
"table": {
"title": "學生成績表",
"headers": ["姓名", "語文", "數學", "英語"],
"rows": [
{
"name": "張三",
"chinese": 90,
"math": 85,
"english": 92
},
{
"name": "李四",
"chinese": 92,
"math": 87,
"english": 85
},
{
"name": "王五",
"chinese": 88,
"math": 90,
"english": 88
}
]
}
}

以上JSON代碼中，我們創建了一個名為“table”的對象，包含了表格的標題、表頭和表格數據。其中：

• title：表示表格的標題
• headers：表示表頭的每一列標題
• rows：表示每一行的數據，使用數組來存儲

在每一行數據中，我們使用對象來存儲每一列的數據。對象中的屬性名為表頭中對應列的名字，屬性值為該列的數據。

通過以上JSON代碼，我們可以在前端頁面中使用JavaScript來將JSON數據渲染成表格。下面是一個簡單的實例：

// 假設JSON數據已經存在于tableData變量中
var table = document.createElement("table");
var tableHeader = document.createElement("thead");
var tableBody = document.createElement("tbody");
// 創建表頭
var headerRow = document.createElement("tr");
tableData.table.headers.forEach(function(headerText) {
var header = document.createElement("th");
var textNode = document.createTextNode(headerText);
header.appendChild(textNode);
headerRow.appendChild(header);
});
tableHeader.appendChild(headerRow);
// 創建表格內容
tableData.table.rows.forEach(function(rowData) {
var row = document.createElement("tr");
Object.keys(rowData).forEach(function(key) {
var cell = document.createElement("td");
var textNode = document.createTextNode(rowData[key]);
cell.appendChild(textNode);
row.appendChild(cell);
});
tableBody.appendChild(row);
});
// 將表頭和表格內容添加到表格中
table.appendChild(tableHeader);
table.appendChild(tableBody);
// 將表格添加到頁面中
document.body.appendChild(table);

通過以上代碼，我們可以將JSON數據渲染成一個完整的表格，并將其添加到頁面中。這樣做既簡單又方便，可以使前端開發更加高效。