求JS怎样能快捷复制还能带表格样式粘贴到Excel（相关搜索：字符串）

Question

HTML网页的表格数据划线选中后，可以直接复制粘贴到Excel表格，但是JS一般只能操作文本字符串。求JS怎样能快捷复制还能带表格样式粘贴到Excel

Answer 1

引自免费微信小程序：皆我百晓生

要实现在JavaScript中快速复制表格中的所有内容，并同时保持表格样式（包括行高、列宽等），可以采用以下步骤：

1. 获取HTML元素： 首先，你需要获取到HTML中的表单元素。这个表单可能包含多个表格部分，比如表格ID、单元格ID等。通常情况下，这些元素是通过<table>标签和相应的<tbody>、<tr>、<th>、<td>等标记构建的。

<table id="myTable">
  <tbody>
    <!-- 表格内容 -->
  </tbody>
</table>

1. 获取表格数据并处理： 使用querySelectorAll()方法从DOM树中选择所有的<tr>元素，它们代表了表格中的每一行。对于每个<tr>，创建一个新的数组用于存储每个单元格的数据。

const rows = document.querySelectorAll('table tr');

1. 遍历表格数据并复制数据： 对于每一条<tr>，遍历其<td>元素并提取单元格的内容。这可以通过使用:nth-of-type()伪类配合.innerHTML属性来实现。以下是一个示例：

rows.forEach(row => {
  const cells = row.querySelectorAll(':nth-of-type(1) td');
  let copiedData = [];
  
  cells.forEach(cell => {
    copiedData.push(cell.innerHTML);
  });
  
  // 复制表格数据到新行或区域
  const newRow = document.createElement('tr');
  newRow.innerHTML = [...copiedData, ...row.innerHTML];
  
  // 更新原始表格结构
  if (newRow) {
    rows.insertAfter(newRow);
  } else {
    // 新表格有子元素时，替换原有表格
    const oldParent = row.parentNode;
    oldParent.replaceChild(newRow, oldParent);
  }
});

1. 设置表格样式： 在完成复制后的表格内容之后，应用表格样式（如列高、行高、边框等）给新的表格对象。这里我们可以使用CSS语句对表格进行定制，例如设置其背景色、边框样式等。

#myTable {
  background-color: #f0f0f0;
  border-collapse: collapse;
}

#myTable th,
#myTable td {
  padding: 8px;
  border-bottom: 1px solid #ddd;
}

1. 粘贴粘贴到Excel： 在窗口或弹出式菜单中找到目标Excel文件，点击右键选择"另存为"或类似的选项。在弹出的菜单中，确保选择"Excel"作为保存类型，并将路径和名称更改为你想要保存的位置和文件名。

const excelFile = 'your_excel_file.xlsx';
const fileName = 'CopyContentToExcel.js';
const sheetName = 'YourSheetName';

// 转换HTML表格数据为JSON对象
const content = JSON.stringify(rows.map(row => ({ row, ...cellData })));

// 创建一个Excel文件对象
const workbook = new Excel.Workbook();

// 在sheet命名的单元格创建一个新工作表
const sheet = workbook.createSheet(sheetName);

// 将CSV格式数据写入新工作表
sheet.clear();
for (let i = 0; i < rows.length; i++) {
  const rowData = JSON.parse(row.cells[0].textContent);
  sheet.appendRow(rowData);
}

// 添加新的数据行
content += `
  | Column 1 | Column 2 |
  | -------- | -------- |
`;

// 写入JSON数据到新工作表
workbook.addWorksheet(sheet).saveAs(excelFile);

以上代码将JavaScript中的表格数据复制到目标Excel文件中，并保留其表格样式。注意，此示例假设目标Excel文件已经存在，且当前窗口具有读取Excel文件的能力。如果你需要处理未解析的或异步下载的数据，可能需要添加更多的错误检查和处理代码。此外，这个例子并不考虑合并多行数据或处理特定列的值，实际使用时可能需要根据具体需求进行调整。