javascript - javascript中的动态表

Question

我正在尝试在 js 中创建动态表。

var tableBody = document.createElement('TBODY');
table.appendChild(tableBody);
   for (var i = 0; i < results.rows.length; i++)
     {
        var tr = document.createElement('TR');
        tableBody.appendChild(tr);

        for(var j = 0; j < 7; j++)
        {

        var td = document.createElement('TD');
        td.width = '75';
        td.appendChild(document.createTextNode(results.rows.item(i).medicine_name));
        tr.appendChild(td); 
        td.appendChild(document.createTextNode(results.rows.item(i).tm_1));
        tr.appendChild(td); 
        td.appendChild(document.createTextNode(results.rows.item(i).tm_2));
        tr.appendChild(td); 
        td.appendChild(document.createTextNode(results.rows.item(i).tm_3));
        tr.appendChild(td); 
        td.appendChild(document.createTextNode(results.rows.item(i).dosage));
        tr.appendChild(td); 
        td.appendChild(document.createTextNode(results.rows.item(i).diagnosis));
        tr.appendChild(td); 
        td.appendChild(document.createTextNode(results.rows.item(i).instructions));
        tr.appendChild(td); 

        }


     }
         myTableDiv.appendChild(table);

当我执行此代码时，将创建 7 行，其中包含所有项目。我想将每个数据插入单独的列中。我该怎么做？我希望医学名称在一列中。tm_1 在另一个等等。

**根据results.rows.length值决定行数，列数为 7

Answer 1

  for (var i = 0; i < results.length; i++) {
            var html = "";
            html += "<tr>";    
            html += "<td>" + results[i].MedicineName + "</td>";
            html += "<td>" + results[i].tm_1+ "</td>";
            html += "<td>" + results[i].tm_2+ "</td>";
            html += "<td>" + results[i].dosage+ "</td>";
            html += "<td>" + results[i].diagnosis+ "</td>";
            html += "<td>" + results[i].instructions+ "</td>";          
            html += "</tr>";
            $('#myTableDiv').append(html);
        }

Answer 2

<script>
    $(document).ready(function () {
        var results = getResults();
        createTable(results);

    });
    function createTable(results) {
        for (var i = 0; i < results.length; i++) {
            var html = "";
            html += "<tr>";
            html += "<td>" + results[i].MedicineName + "</td>";
            html += "<td>" + results[i].tm_1 + "</td>";
            html += "<td>" + results[i].tm_2 + "</td>";
            html += "<td>" + results[i].dosage + "</td>";
            html += "<td>" + results[i].diagnosis + "</td>";
            html += "<td>" + results[i].instructions + "</td>";
            html += "</tr>";
            $('#myTableDiv').append(html);
        }
    }
    function getResults() {
        var Results = new Array(0);

        for (var j = 0; j < 4; j++) {
            var data = new medicine;
            data.MedicineName = "Medicine" + j;
            data.tm_1 = "tm1" + j;
            data.tm_2 = "tm2" + j;
            data.dosage = "tm3" + j;
            data.diagnosis = "tm4" + j;
            data.instructions = "tm5" + j;        
            Results.push(data);
        }
        return Results;
    };
    function medicine() {
        var MedicineName = new String();     
        var tm_1 = new String();
        var tm_2 = new String();
        var dosage = new String();
        var diagnosis = new String();
        var instructions = new String();
    }
</script>

Answer 3

总共你有 7 列和 7 行。所以在第一个文本节点td.appendChild(document.createTextNode(results.rows.item((i*7) + 0).medicine_name));和第二个文本节点中使用 td.appendChild(document.createTextNode(results.rows.item((i*7) + 1).tm_1));等等......