【含代码】Excel文件合并工具，我的AI编程经历
zhezhongyun 2025-06-12 19:04 31 浏览
本人业余爱好编写小工具，20年前用VB写，后来用易语言写，2023年了解过ChatGPT用于写代码，但一直没有尝试过，主要是懒！今年初DeepSeek的爆火，带动了一大批AI应用，也终于尝试起了DeepSeek+Trae的组合编程方式，结论就是：不懂编程的人已经可用AI轻松编写出实用工具。
近期的代码文章
工作中经常会对Excel文件进行合并，想着手工其实也花不了太多时间，就没有尝试自己写工具来完成（给懒找个理由），当然在大量裁人的这个工作环境下，也只有依靠工具来提高工作效率，勉强抵销人员减少的压力，牛马人的悲哀！实际工具出来后确实轻松多了。
Python版开发了6小时，主要是与AI交互没经验，走了很多弯路，python代码编写容易且代码量少，生成exe和分享确实太难，可能是我还没找到方法，最终放弃这种方案。
Python版切换为HTML版用了1 小时，多种架构和不同的编程环境能顺利切换，完全依靠DeepSeek+Trae，以前对我来说是不敢想的事，现在轻松完成，由于Html+javascript可以通过浏览器直接解释执行，不用打包成exe，分享也只需要建一个网络连接或者直接分享这个文件，用浏览器打开就可运行，方便使用。
Excel文件合并工具-Htmll的功能不介绍了，说一下怎么使用吧！
1、把文末的代码块复制，粘贴到记事本中，并另存为 Excel文件合并工具.html
2、双击《Excel文件合并工具.html》，默认的浏览器会打开该文件，打开后的界面如下图
3、如果第一步也不会弄，那么可以试试我自建的分享链接，点击打开就可以使用：
PS：之前用手机发，不知道怎么分享代码，看到别人可以发代码，才发现电脑版可以用文章把代码分享出来，希望对有需要的人有所帮助。
【附Html源代码】
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Excel文件合并工具</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"></script>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
max-width: 1000px;
margin: 0 auto;
}
.container {
display: flex;
gap: 20px;
}
.left-panel, .right-panel {
flex: 1;
}
table {
width: 100%;
border-collapse: collapse;
margin-bottom: 20px;
}
th, td {
border: 1px solid #ddd;
padding: 8px;
text-align: left;
}
th {
background-color: #f2f2f2;
}
button {
padding: 8px 16px;
margin: 5px;
cursor: pointer;
}
.file-list {
margin: 10px 0;
}
.file-item {
display: flex;
justify-content: space-between;
margin: 5px 0;
}
/* 删除重复的<style>标签 */
tr.selected {
background-color: #e0f7e0 !important; /* 浅绿色背景 */
}
@media (max-width: 768px) {
.container {
flex-direction: column;
gap: 15px;
}
.left-panel, .right-panel {
width: 100%;
}
}
/* 新增选择器 */
input[type="file"] {
padding: 6px;
border: 1px solid #ddd;
border-radius: 4px;
}
button:hover {
opacity: 0.9;
}
/* 优化表格选择器 */
#mappingTable tr:hover,
#sourceTable tr:hover {
background-color: #f5f5f5;
}
/* 拖拽样式 */
#mappingTable tr {
cursor: move;
user-select: none;
-webkit-user-drag: element;
}
#mappingTable tr.dragging {
opacity: 0.5;
background-color: #e0e0e0;
}
</style>
</head>
<body>
<h1>Excel文件合并工具</h1>
<div>
<input type="file" id="excelFiles" multiple accept=".xlsx, .xls" />
<button onclick="loadFiles()">加载文件</button>
<label><input type="checkbox" id="includeSubfolders" checked /> 包含子文件夹</label>
<button onclick="addMapping()">添加映射</button>
<button onclick="removeMapping()">删除映射</button>
<button onclick="mergeFiles()">合并文件</button>
<button onclick="saveConfig()">保存配置</button>
<button onclick="loadConfig()">加载配置</button>
</div>
<div class="container">
<div class="left-panel">
<h3>列映射 <span style="font-size: 0.8em; color: #666;">(拖动可改变顺序)</span></h3>
<table id="mappingTable">
<thead>
<tr>
<th>合并后字段名</th>
<th>合并前字段名</th>
<th>操作</th>
</tr>
</thead>
<tbody></tbody>
</table>
<script>
// 拖拽排序功能
document.addEventListener('DOMContentLoaded', function() {
const table = document.getElementById('mappingTable');
let draggedItem = null;
// 设置行可拖动
table.addEventListener('dragstart', function(e) {
if (e.target.tagName === 'TR') {
draggedItem = e.target;
e.dataTransfer.effectAllowed = 'move';
e.dataTransfer.setData('text/html', draggedItem);
setTimeout(() => {
draggedItem.style.display = 'none';
}, 0);
}
});
table.addEventListener('dragover', function(e) {
e.preventDefault();
const targetRow = e.target.closest('tr');
if (targetRow && targetRow !== draggedItem) {
const rect = targetRow.getBoundingClientRect();
const midPoint = rect.top + rect.height / 2;
if (e.clientY < midPoint) {
table.insertBefore(draggedItem, targetRow);
} else {
table.insertBefore(draggedItem, targetRow.nextSibling);
}
}
});
table.addEventListener('dragend', function() {
if (draggedItem) {
const targetName = draggedItem.cells[0].textContent;
const wasSelected = draggedItem.classList.contains('selected');
draggedItem.style.display = '';
draggedItem = null;
updateColumnOrder();
// 恢复选中状态
if (wasSelected) {
const rows = table.querySelectorAll('tbody tr');
rows.forEach(row => {
if (row.cells[0].textContent === targetName) {
row.classList.add('selected');
}
});
}
}
});
// 删除列映射
function removeMapping() {
const selectedRows = document.querySelectorAll('#mappingTable tbody tr.selected');
if (selectedRows.length === 0) {
alert('请先选择要删除的映射');
return;
}
// 确认删除
if (!confirm(`确定要删除选中的${selectedRows.length}个映射吗？`)) {
return;
}
// 先收集所有要删除的目标名称
const targetsToDelete = Array.from(selectedRows).map(row =>
row.cells[0].textContent
);
// 然后统一删除
targetsToDelete.forEach(target => {
delete columnMapping[target];
});
refreshMappingTable();
refreshSourceTable();
}
// 更新列映射顺序
function updateColumnOrder() {
const rows = table.querySelectorAll('tbody tr');
const newMapping = {};
// 先处理表格中存在的行
rows.forEach(row => {
const targetName = row.cells[0].textContent;
if (columnMapping[targetName]) {
newMapping[targetName] = {
sources: [...columnMapping[targetName].sources],
allowNull: columnMapping[targetName].allowNull
};
}
});
// 同步更新columnMapping
columnMapping = newMapping;
console.log('列映射顺序已更新:', columnMapping);
refreshMappingTable(); // 刷新表格以反映新顺序
return true; // 返回成功状态
}
// 加载配置后重新初始化拖拽功能
function loadConfig() {
const input = document.createElement('input');
input.type = 'file';
input.accept = '.json';
input.onchange = e => {
const file = e.target.files[0];
const reader = new FileReader();
reader.onload = function(e) {
try {
const config = JSON.parse(e.target.result);
columnMapping = config.columnMapping || {};
refreshMappingTable();
refreshSourceTable();
makeRowsDraggable(); // 重新初始化拖拽功能
} catch (error) {
console.error('加载配置出错:', error);
alert('加载配置失败，请检查文件格式');
}
};
reader.readAsText(file);
};
input.click();
}
// 为表格行添加draggable属性和事件监听
function makeRowsDraggable() {
const rows = table.querySelectorAll('tbody tr');
rows.forEach(row => {
row.setAttribute('draggable', 'true');
// 移除旧的事件监听器
row.removeEventListener('dragstart', handleDragStart);
row.removeEventListener('dragover', handleDragOver);
row.removeEventListener('dragend', handleDragEnd);
// 添加新的事件监听器
row.addEventListener('dragstart', handleDragStart);
row.addEventListener('dragover', handleDragOver);
row.addEventListener('dragend', handleDragEnd);
});
}
// 拖拽开始事件处理
function handleDragStart(e) {
e.dataTransfer.setData('text/plain', e.target.dataset.targetName || '');
e.target.classList.add('dragging');
}
// 拖拽悬停事件处理
function handleDragOver(e) {
e.preventDefault();
const draggingElement = document.querySelector('.dragging');
if (draggingElement && e.target.parentNode.tagName === 'TR') {
const targetRow = e.target.closest('tr');
const tableBody = targetRow.parentNode;
const rows = Array.from(tableBody.querySelectorAll('tr'));
const draggingIndex = rows.indexOf(draggingElement);
const targetIndex = rows.indexOf(targetRow);
if (draggingIndex !== targetIndex) {
if (draggingIndex < targetIndex) {
tableBody.insertBefore(draggingElement, targetRow.nextSibling);
} else {
tableBody.insertBefore(draggingElement, targetRow);
}
}
}
}
// 拖拽结束事件处理
function handleDragEnd(e) {
e.target.classList.remove('dragging');
updateColumnOrder(); // 更新列映射顺序
}
// 初始化时设置行可拖动
makeRowsDraggable();
// 监听表格内容变化，重新设置行可拖动
const observer = new MutationObserver(makeRowsDraggable);
observer.observe(table, { childList: true, subtree: true });
});
</script>
</div>
<div class="right-panel">
<h3>可选字段 <span style="font-size: 0.8em; color: #666;">(单击选择，支持多选)</span></h3>
<table id="sourceTable">
<thead>
<tr>
<th>字段名</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
</div>
<script>
// 全局变量
let allColumns = new Set();
let columnMapping = {};
let excelFiles = [];
let fileData = {};
// 加载Excel文件
// 删除updateFileList函数
function loadFiles() {
const fileInput = document.getElementById('excelFiles');
const files = fileInput.files;
if (files.length === 0) {
alert('请先选择Excel文件');
return;
}
excelFiles = Array.from(files);
scanExcelFiles(); // 直接调用扫描函数
}
// 扫描Excel文件获取列名
function scanExcelFiles() {
allColumns = new Set();
fileData = {};
const includeSubfolders = document.getElementById('includeSubfolders').checked;
const promises = excelFiles.map(file => {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.onload = function(e) {
try {
const data = new Uint8Array(e.target.result);
const workbook = XLSX.read(data, { type: 'array' });
// 遍历所有工作表
workbook.SheetNames.forEach(sheetName => {
const sheet = workbook.Sheets[sheetName];
const jsonData = XLSX.utils.sheet_to_json(sheet, { header: 1, defval: "" });
if (jsonData.length > 0) {
// 自动检测表头行
let headerRow = 0;
let maxCols = 0;
for (let i = 0; i < Math.min(5, jsonData.length); i++) {
const nonEmpty = jsonData[i].filter(cell => cell !== "").length;
if (nonEmpty > maxCols) {
maxCols = nonEmpty;
headerRow = i;
}
}
const headers = jsonData[headerRow] || [];
// 添加所有非空列名
headers.forEach(header => {
if (header && typeof header === 'string') {
allColumns.add(header);
}
});
// 添加特殊字段
allColumns.add("文件名");
allColumns.add("文件路径");
// 注释掉工作表名，因为它不应该出现在可选字段中
// allColumns.add("工作表名");
// 保存文件数据
if (!fileData[file.name]) {
fileData[file.name] = {};
}
fileData[file.name][sheetName] = {
headers: headers,
data: jsonData.slice(headerRow + 1), // 跳过表头行
path: file.webkitRelativePath || file.name
};
}
});
resolve();
} catch (error) {
console.error(`处理文件 ${file.name} 时出错:`, error);
reject(error);
}
};
reader.onerror = reject;
reader.readAsArrayBuffer(file);
});
});
Promise.all(promises)
.then(() => {
refreshSourceTable();
alert(`扫描完成，共发现 ${allColumns.size} 个字段`);
})
.catch(error => {
console.error('扫描文件时出错:', error);
alert('扫描文件时出错，请检查文件格式');
});
}
// 刷新源字段表格
function refreshSourceTable() {
const tableBody = document.querySelector('#sourceTable tbody');
tableBody.innerHTML = '';
// 获取已映射的所有源字段
const mappedSources = new Set();
Object.values(columnMapping).forEach(mapping => {
mapping.sources.forEach(source => mappedSources.add(source));
});
// 获取未映射的字段并排序
const unmappedSources = Array.from(allColumns)
.filter(col => !mappedSources.has(col))
.sort();
// 填充表格
unmappedSources.forEach(col => {
const row = document.createElement('tr');
row.innerHTML = `
<td>${col}</td>
`;
row.onclick = function() {
this.classList.toggle('selected');
};
tableBody.appendChild(row);
});
}
// 添加列映射
function addMapping() {
const selectedRows = document.querySelectorAll('#sourceTable tbody tr.selected');
if (selectedRows.length === 0) {
alert('请先选择要映射的字段');
return;
}
const selectedSources = Array.from(selectedRows).map(row =>
row.cells[0].textContent.trim() // 添加trim()去除空格
).filter(Boolean); // 过滤掉空值
if (selectedSources.length === 0) {
alert('没有有效的字段被选中');
return;
}
// 使用第一个选中的字段作为合并后字段名
const target = selectedSources[0];
// 添加到映射关系
columnMapping[target] = {
sources: selectedSources,
allowNull: false
};
// 刷新表格
refreshMappingTable();
refreshSourceTable();
// 清除选中状态
selectedRows.forEach(row => row.classList.remove('selected'));
}
// 删除列映射
function removeMapping() {
const selectedRows = document.querySelectorAll('#mappingTable tbody tr.selected');
if (selectedRows.length === 0) {
alert('请先选择要删除的映射');
return;
}
// 确认删除
if (!confirm(`确定要删除选中的${selectedRows.length}个映射吗？`)) {
return;
}
Array.from(selectedRows).forEach(row => {
const target = row.cells[0].textContent;
delete columnMapping[target];
row.classList.remove('selected');
});
refreshMappingTable();
refreshSourceTable();
}
// 刷新映射表格
function refreshMappingTable() {
const tableBody = document.querySelector('#mappingTable tbody');
tableBody.innerHTML = '';
Object.entries(columnMapping).forEach(([target, mapping]) => {
const row = document.createElement('tr');
row.innerHTML = `
<td>${target}</td>
<td>${mapping.sources.join(', ')}</td>
<td>
<button onclick="toggleAllowNull('${target}')">允许空值: ${mapping.allowNull ? '是' : '否'}</button>
</td>
`;
row.onclick = function() {
this.classList.toggle('selected');
};
tableBody.appendChild(row);
});
}
// 切换允许空值状态
function toggleAllowNull(target) {
if (columnMapping[target]) {
columnMapping[target].allowNull = !columnMapping[target].allowNull;
refreshMappingTable();
}
}
// 合并文件
function mergeFiles() {
if (Object.keys(columnMapping).length === 0) {
alert('请先设置列映射');
return;
}
const mergedData = [];
excelFiles.forEach(file => {
const fileSheets = fileData[file.name];
if (!fileSheets) return;
const filename = file.name.replace(/\.[^/.]+$/, ""); // 去掉扩展名
// 遍历文件的所有工作表
Object.entries(fileSheets).forEach(([sheetName, sheetData]) => {
const { headers, data } = sheetData;
// 处理每行数据
data.forEach(row => {
const rowData = {};
rowData["文件名"] = filename;
// 只有当工作表名在列映射中时才添加到结果
if (columnMapping["工作表名"]) {
rowData["工作表名"] = sheetName;
}
// 处理映射
let shouldSkip = false;
Object.entries(columnMapping).forEach(([target, mapping]) => {
if (shouldSkip) return;
// 尝试从源列获取值
for (const source of mapping.sources) {
const colIndex = headers.indexOf(source);
if (colIndex !== -1 && row[colIndex] !== undefined) {
rowData[target] = row[colIndex];
break;
}
}
// 检查是否不允许为空且确实为空
if (!mapping.allowNull && (rowData[target] === undefined || rowData[target] === '')) {
shouldSkip = true;
}
});
if (!shouldSkip) {
mergedData.push(rowData);
}
});
});
});
// 创建合并后的工作表
const ws = XLSX.utils.json_to_sheet(mergedData);
const wb = XLSX.utils.book_new();
XLSX.utils.book_append_sheet(wb, ws, "合并数据");
// 触发下载
XLSX.writeFile(wb, "合并结果.xlsx");
alert('文件合并完成，已下载');
}
// 保存配置
function saveConfig() {
const config = {
columnMapping: columnMapping
};
const blob = new Blob([JSON.stringify(config, null, 2)], { type: 'application/json' });
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = url;
a.download = 'excel_merger_config.json';
a.click();
URL.revokeObjectURL(url);
}
// 加载配置
function loadConfig() {
const input = document.createElement('input');
input.type = 'file';
input.accept = '.json';
input.onchange = e => {
const file = e.target.files[0];
const reader = new FileReader();
reader.onload = function(e) {
try {
const config = JSON.parse(e.target.result);
if (config.columnMapping) {
columnMapping = config.columnMapping;
refreshMappingTable();
refreshSourceTable();
alert('配置加载成功');
}
} catch (error) {
console.error('加载配置时出错:', error);
alert('加载配置时出错，请检查文件格式');
}
};
reader.readAsText(file);
};
input.click();
}
</script>
</body>
</html>相关推荐
- Python入门学习记录之一:变量_python怎么用变量
-
写这个，主要是对自己学习python知识的一个总结，也是加深自己的印象。变量（英文：variable），也叫标识符。在python中，变量的命名规则有以下三点：>变量名只能包含字母、数字和下划线...
- python变量命名规则——来自小白的总结
-
python是一个动态编译类编程语言，所以程序在运行前不需要如C语言的先行编译动作，因此也只有在程序运行过程中才能发现程序的问题。基于此，python的变量就有一定的命名规范。python作为当前热门...
- Python入门学习教程:第 2 章 变量与数据类型
-
2.1什么是变量？在编程中，变量就像一个存放数据的容器，它可以存储各种信息，并且这些信息可以被读取和修改。想象一下，变量就如同我们生活中的盒子，你可以把东西放进去，也可以随时拿出来看看，甚至可以换成...
- 绘制学术论文中的“三线表”具体指导
-
在科研过程中，大家用到最多的可能就是“三线表”。“三线表”，一般主要由三条横线构成，当然在变量名栏里也可以拆分单元格，出现更多的线。更重要的是，“三线表”也是一种数据记录规范，以“三线表”形式记录的数...
- Python基础语法知识--变量和数据类型
-
学习Python中的变量和数据类型至关重要，因为它们构成了Python编程的基石。以下是帮助您了解Python中的变量和数据类型的分步指南：1.变量：变量在Python中用于存储数据值。它们充...
- 一文搞懂 Python 中的所有标点符号
-
反引号`无任何作用。传说Python3中它被移除是因为和单引号字符'太相似。波浪号~（按位取反符号）~被称为取反或补码运算符。它放在我们想要取反的对象前面。如果放在一个整数n...
- Python变量类型和运算符_python中变量的含义
-
别再被小名词坑哭了：Python新手常犯的那些隐蔽错误，我用同事的真实bug拆给你看我记得有一次和同事张姐一起追查一个看似随机崩溃的脚本，最后发现罪魁祸首竟然是她把变量命名成了list。说实话...
- 从零开始:深入剖析 Spring Boot3 中配置文件的加载顺序
-
在当今的互联网软件开发领域，SpringBoot无疑是最为热门和广泛应用的框架之一。它以其强大的功能、便捷的开发体验，极大地提升了开发效率，成为众多开发者构建Web应用程序的首选。而在Spr...
- Python中下划线 ‘_’ 的用法，你知道几种
-
Python中下划线()是一个有特殊含义和用途的符号，它可以用来表示以下几种情况：1在解释器中，下划线(_)表示上一个表达式的值，可以用来进行快速计算或测试。例如：>>>2+...
- 解锁Shell编程:变量_shell $变量
-
引言：开启Shell编程大门Shell作为用户与Linux内核之间的桥梁，为我们提供了强大的命令行交互方式。它不仅能执行简单的文件操作、进程管理，还能通过编写脚本实现复杂的自动化任务。无论是...
- 一文学会Python的变量命名规则!_python的变量命名有哪些要求
-
目录1.变量的命名原则3.内置函数尽量不要做变量4.删除变量和垃圾回收机制5.结语1.变量的命名原则①由英文字母、_(下划线)、或中文开头②变量名称只能由英文字母、数字、下画线或中文字所组成。③英文字...
- 更可靠的Rust-语法篇-区分语句/表达式，略览if/loop/while/for
-
src/main.rs://函数定义fnadd(a:i32,b:i32)->i32{a+b//末尾表达式}fnmain(){leta:i3...
- C++第五课:变量的命名规则_c++中变量的命名规则
-
变量的命名不是想怎么起就怎么起的，而是有一套固定的规则的。具体规则：1.名字要合法：变量名必须是由字母、数字或下划线组成。例如：a，a1，a_1。2.开头不能是数字。例如：可以a1，但不能起1a。3....
- Rust编程-核心篇-不安全编程_rust安全性
-
Unsafe的必要性Rust的所有权系统和类型系统为我们提供了强大的安全保障，但在某些情况下，我们需要突破这些限制来：与C代码交互实现底层系统编程优化性能关键代码实现某些编译器无法验证的安全操作Rus...
- 探秘 Python 内存管理:背后的神奇机制
-
在编程的世界里，内存管理就如同幕后的精密操控者，确保程序的高效运行。Python作为一种广泛使用的编程语言，其内存管理机制既巧妙又复杂，为开发者们提供了便利的同时，也展现了强大的底层控制能力。一、P...
- 一周热门
- 最近发表
- 标签列表
-
- HTML 教程 (33)
- HTML 简介 (35)
- HTML 实例/测验 (32)
- HTML 测验 (32)
- JavaScript 和 HTML DOM 参考手册 (32)
- HTML 拓展阅读 (30)
- HTML文本框样式 (31)
- HTML滚动条样式 (34)
- HTML5 浏览器支持 (33)
- HTML5 新元素 (33)
- HTML5 WebSocket (30)
- HTML5 代码规范 (32)
- HTML5 标签 (717)
- HTML5 标签 (已废弃) (75)
- HTML5电子书 (32)
- HTML5开发工具 (34)
- HTML5小游戏源码 (34)
- HTML5模板下载 (30)
- HTTP 状态消息 (33)
- HTTP 方法：GET 对比 POST (33)
- 键盘快捷键 (35)
- 标签 (226)
- opacity 属性 (32)
- transition 属性 (33)
- 1-1. 变量声明 (31)