怎么在前端获取后端数据生成表格json

  $.ajax({url: '/Resource/GetResource',data: { searchText: searchText },success: function (response) {/*searchResult.innerHTML = response;*/console.log('输入框 ：', response);// 假设你有一个具有 id 为 "tableContainer" 的 HTML 元素用于显示表格var tableContainer = document.getElementById("centerbox");// 解析 JSON 字符串var data = JSON.parse(response);// 创建表格元素var table = document.createElement("table");table.className = "table table-hover table-striped";// 创建表头var thead = document.createElement("thead");var headerRow = document.createElement("tr");Object.keys(data[0]).forEach(function (key) {var th = document.createElement("th");th.textContent = key;headerRow.appendChild(th);});// 添加编辑和删除表头var actionTh = document.createElement("th");actionTh.textContent = "操作";headerRow.appendChild(actionTh);thead.appendChild(headerRow);table.appendChild(thead);// 创建表格内容var tbody = document.createElement("tbody");data.forEach(function (row) {var tr = document.createElement("tr");Object.values(row).forEach(function (value,index) {var td = document.createElement("td");td.textContent = value;tr.appendChild(td);if (index === 1) {// 隐藏第二列的数据，创建一个按钮来显示数据var button = document.createElement("button");button.textContent = "Show Data打开";button.addEventListener("click", function () {// 点击按钮时显示第二列的数据td.style.display = "table-cell";button.style.display = "none";});tr.appendChild(button);}});// 添加编辑和删除按钮var editButton = document.createElement("button");editButton.textContent = "Edit";editButton.addEventListener("click", function () {// 编辑按钮点击事件处理程序// 在这里编写编辑逻辑console.log("Edit button clicked for row:", row);});tr.appendChild(editButton);var deleteButton = document.createElement("button");deleteButton.textContent = "Delete";deleteButton.addEventListener("click", function () {// 删除按钮点击事件处理程序// 在这里编写删除逻辑console.log("Delete button clicked for row:", row);});tr.appendChild(deleteButton);tbody.appendChild(tr);});table.appendChild(tbody);// 将表格添加到容器中tableContainer.appendChild(table);}});