如何在表javascript中正确创建表

How to correctly make a table inside a table javascript

本文关键字:创建 javascript      更新时间:2023-09-26

我使用 HTML 标签在 javascript 中创建了十个单独的表。 我现在想将这些表格放在网格格式中,所以我认为将它们放入另一个表格中会起作用。 此代码只是显示一个空表。 有什么帮助吗? 谢谢!

 document.getElementById('InstalledApps').innerHTML += '<table id="bigAppsTable" border="1"><td>';
    for (var i = 9; i>-1;i--){  
        document.getElementById('InstalledApps').innerHTML += '<table id="appsTable'+i+'" border="1"><tr></tr>';
        var thirdRow=document.getElementById("appsTable"+i).insertRow(1);
        if (the_data[i]['release'] != null){
        thirdRow.insertCell(-1).innerHTML="<b>Release: ";
        thirdRow.insertCell(-1).innerHTML=the_data[i]['release'];
        }
        var secondRow=document.getElementById("appsTable"+i).insertRow(1);
        secondRow.insertCell(-1).innerHTML="<b>Version: ";
        secondRow.insertCell(-1).innerHTML=the_data[i]['version'];
        var firstRow=document.getElementById("appsTable"+i).insertRow(1);
        firstRow.insertCell(-1).innerHTML="<b>Name:";
        firstRow.insertCell(-1).innerHTML=the_data[i]['name'];
        }

既然您正在动态创建表,为什么不使用 DOM API?(即不innerHTML

这是入门的好地方:https://developer.mozilla.org/en-US/docs/Web/API/document.createElement

像这样尝试

var aTable = document.createElement('table');
for (var i = 0, tr, td; i < 9; i++) {
    tr = document.createElement('tr');
    td = document.createElement('td');
    td.appendChild(document.createTextNode("some text"));
    tr.appendChild(td);
    aTable.appendChild(tr);
}
//update with id
document.getElementById('table').appendChild(aTable);