如何用json对象内容填充html表

时间:2018-11-08 09:27:39

标签: asp.net json ajax html-table

我正在ajax调用中返回列表,成功函数如下所示。 我的json的内容类似{“ 1”,“ ayesha”,“ cs”,“ Lahore”}。

 function ShowData(data) {
         var data = data.d;

        var html = "";
        if (data.length > 0) {
            JObject = data;
            console.log(JObject);
            html = "<table id='tbl' class='TableGrid'  width='100%' >";
            html += "<thead><tr><th>StdId</th><th>Name</th><th>feild</th><th>City</th></thead><tbody> ";
            for (var i = 0; i < JObject.length; i++) {
                html += '<tr>';
                html += ' <td align="left" >' + JObject[i] + '</td>';
                html += '</tr>';
            }
            html += "</tbody> </table>";

        }

我应该如何显示内容?

2 个答案:

答案 0 :(得分:0)

使用波纹管脚本可以帮助创建表

  1. var table = document.createElement(“ table”);
  2. var thead = document.createElement(“ thead”);
  3. var tr = document.createElement(“ tr”);
  4. var th = document.createElement(“ th”);
  5. var td = document.createElement(“ td”);
  6. table.appendChild(thread).appendChild(th);
  7. table.appendChild(tr).appendChild(td)

答案 1 :(得分:0)

使用.innerHTML将表格插入模板中。

DOCS:https://www.w3schools.com/jsref/prop_html_innerhtml.asp