日韩欧美人妻无码精品白浆,www.大香蕉久久网,狠狠的日狠狠的操,日本好好热在线观看

純JavaScript代碼導出HTML的DIV中多個table到Excel文件的同一個工作表中并下載，以下是實現(xiàn)將DIV內多個表格合并導出到Excel同一工作表的解決方案：

<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"></script>

?
<div id="printA">
  <!-- 表格1 -->
  <table>
    <tr><th>姓名</th><th>部門</th></tr>
    <tr><td>張三</td><td>技術部</td></tr>
  </table>
  
  <!-- 表格2 -->
  <table>
    <tr><th>項目</th><th>進度</th></tr>
    <tr><td>系統(tǒng)升級</td><td>50%</td></tr>
    <tr><td>安全審計</td><td>已完成</td></tr>
  </table>
</div>


<button onclick="exportAllToOneSheet()">合并導出</button>


<script>
function exportAllToOneSheet() {
  const div = document.getElementById('printA');
  const tables = div.getElementsByTagName('table');
  const wb = XLSX.utils.book_new();
  const ws = XLSX.utils.aoa_to_sheet([[]]); // 創(chuàng)建空工作表


  let currentRow = 0; // 當前寫入行指針


  Array.from(tables).forEach((table, tableIndex) => {
    // 將表格轉換為二維數(shù)組
    const tableData = XLSX.utils.sheet_to_json(
      XLSX.utils.table_to_sheet(table),
      { header: 1 }
    );


    // 添加表格間的分隔空行（第一個表格前不加）
    if (tableIndex > 0) {
      XLSX.utils.sheet_add_aoa(ws, [[""]], { origin: { r: currentRow, c: 0 } });
      currentRow++;
    }


    // 將表格數(shù)據(jù)寫入工作表
    XLSX.utils.sheet_add_aoa(ws, tableData, {
      origin: { r: currentRow, c: 0 } // 從當前行開始寫入
    });


    // 更新行指針（+數(shù)據(jù)行數(shù)）
    currentRow += tableData.length;
  });


  // 將工作表添加到工作簿
  XLSX.utils.book_append_sheet(wb, ws, "合并數(shù)據(jù)");


  // 生成并下載文件
  XLSX.writeFile(wb, 'combined_tables.xlsx');
}
</script>

關鍵功能說明：

1. 數(shù)據(jù)合并策略：

   • 自動識別每個表格的列結構

   • 按DOM順序從上到下堆疊表格

   • 自動處理不同表格的列差異（自動擴展列）

2. 表格間隔處理：

// 添加分隔空行（可修改為添加分隔線）
if (tableIndex > 0) {
  XLSX.utils.sheet_add_aoa(ws, [[""]], ...);
  currentRow++;
}?

可根據(jù)需要修改為添加分隔線或自定義內容

1. 數(shù)據(jù)寫入控制：

   • currentRow 變量跟蹤當前寫入位置

   • 使用 sheet_add_aoa 方法精確控制寫入位置

高級配置選項（可選）：

// 在函數(shù)開始處添加配置對象
const config = {
  skipHeader: false,    // 是否跳過后續(xù)表格的標題行
  spacing: 1,          // 表格間隔行數(shù)（0=無間隔）
  separatorType: 'row' // 分隔類型：'row'(空行)/'line'(分割線)/'custom'
};


// 使用示例（需要修改實現(xiàn)邏輯）：
if (tableIndex > 0 && config.spacing > 0) {
  // 添加間隔...
}?

不同表格結構處理示例：

當表格列數(shù)不一致時：

注意事項：

1. 樣式保留：SheetJS默認不保留HTML表格樣式，如需樣式請使用以下方法：

// 在table_to_sheet時保留基礎樣式
const ws = XLSX.utils.table_to_sheet(table, {raw: true});?

1. 大數(shù)據(jù)量優(yōu)化：建議添加防抖處理

// 在按鈕點擊時添加
let isExporting = false;
function exportAllToOneSheet() {
  if (isExporting) return;
  isExporting = true;
  // ...原有邏輯...
  isExporting = false;
}?

1. 性能監(jiān)控（適用于超大數(shù)據(jù)量）：

console.time('導出耗時');
// ...導出邏輯...
console.timeEnd('導出耗時'); ?

如果需要保留表格的復雜結構（如合并單元格），可以使用以下增強代碼：

// 替換數(shù)據(jù)合并部分
Array.from(tables).forEach(table => {
  const tempWs = XLSX.utils.table_to_sheet(table);
  XLSX.utils.sheet_add_sheet(ws, tempWs, {
    origin: { r: currentRow, c: 0 },
    // 保留合并信息
    cellStyles: true,
    mergedCells: true
  });
  currentRow += (tempWs['!ref'] ? XLSX.utils.decode_range(tempWs['!ref']).e.r : 0) + 1;
});