簡體   English   中英

將數組值插入特定的表格單元格/列

[英]to insert array values into specific table cells/columns

我正在創建一個函數,該函數應該從數組中獲取數據(結果)並將其放入表的特定列中。 該數組用數字標識,該數字標識應在其中輸入以下數據的列。

例如:

var results = [1, 'aaaaaa', 'bbb',2, 'ccc', 3, 'dddd', 'eeee', 4, 'fff'];

col 1: 'aaaaaa', 'bbb';
col 2: 'ccc'; etc.

我已經嘗試了許多方法,但無法正常工作。

目前,代碼看起來像這樣。 我不確定該怎么做:

var results = [1, 'aaaaaa','bbb',2, 'ccc', 3, 'dddd', 'eeee', 4, 'fff'];
var k = 0;
function populateTable(table, rows, cells, content) {
    if (!table) table = document.createElement('table');
    for (var i = 0; i < rows; ++i) {
        var row = document.createElement('tr');
        for (var j = 0; j < cells; ++j) {
            row.appendChild(document.createElement('td'));
            if (i > 0 && j == 0) {
                row.cells[j].appendChild(document.createTextNode(content + 'PN'));
            }
            else if (i == 0 && j == 0) {
                row.cells[j].appendChild(document.createTextNode(content + 'TYPE'));
            }
            else if (j > 0 && i == 0) {
                row.cells[j].appendChild(document.createTextNode(content + 'LABLE ' + j));
            }

            else if (j > 0 && i > 0 && results[i] != k) {
                    row.cells[k].appendChild(document.createTextNode(content + results[i]));

            }
        }
        table.appendChild(row);
        k++;
    }
    return table;
}

function load() {
    document.getElementById('tablearea')
        .appendChild(populateTable(null, 9, 10, ""));
}

首先將結果格式化為以下格式:

{
  1: ['aaaaaa', 'bbb'],
  2: ['ccc'],
  3: ['dddd', 'eeee'],
  4: ['fff']
}

然后生成表:

 const results = [1, 'aaaaaa', 'bbb',2, 'ccc', 3, 'dddd', 'eeee', 4, 'fff', 5, 'ggg', 'hhhh', 'iiii']; // First format the results const formattedResults = {}; let columnIndex = 0; results.forEach(elt => { if (!isNaN(elt)) { formattedResults[elt] = []; columnIndex = elt; } else { formattedResults[columnIndex].push(elt); } }); // Then generate the table const table = document.createElement('table'); const columnKeys = Object.keys(formattedResults); const maxRows = Math.max(...columnKeys.map(key => formattedResults[key].length)); for (let i = 0; i < maxRows; i = i + 1) { const tr = document.createElement('tr'); columnKeys.forEach(colKey => { const td = document.createElement('td'); if (formattedResults[colKey][i] !== undefined) { td.textContent = formattedResults[colKey][i]; tr.appendChild(td); } }); table.appendChild(tr); } document.getElementById('tableArea').appendChild(table); 
 <div id="tableArea"></div> 

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM