js實現表格動態合并
當前位置:點晴教程→知識管理交流
→『 技術文檔交流 』
// table的id 需要合并的列(從0開始算) mergeCell(tableId, cols) { const table = document.getElementById(tableId); if (!table)return const table_rows = table.rows; // 需要合并的列的數組 cols.forEach((v, k) => { // 循環table每一行 for (let i = 0; i < table_rows.length - 1; i++) { // row let now_row = table_rows[i]; let next_row = table_rows[i + 1];
// col let now_col = now_row.cells[v]; let next_col = next_row.cells[v];
if (now_col.innerHTML == next_col.innerHTML) { // 標記為需要刪除 next_col.classList.add('remove'); // 遞歸判斷當前對象時候已經被刪除 this.setParentSpan(table, i, v); } } }) let removeTds = document.getElementsByClassName('remove'); for (let i = removeTds.length-1; i >= 0; i--) { let eldTd = removeTds[i]; eldTd.parentNode.removeChild(eldTd); } }
setParentSpan(table, row, col) { const col_item = table.rows[row].cells[col]; if (col_item.classList.contains('remove')) { this.setParentSpan(table, --row, col) } else { col_item.rowSpan += 1; } } // 使用,合并id為table1的第一列數據,相同的合并 mergeCell("table1", [0]) 該文章在 2023/11/26 21:54:09 編輯過 |
關鍵字查詢
相關文章
正在查詢... |