当前位置：首页 > news >正文

科技修仙(1)Excel入门训练学习算法——东方仙盟

news 2026/5/12 7:18:18

核心代码

核心算法

// ************************** 修仙版题目配置（含公式答案） ************************** const xianQuestion = { "title": "练气期·第1关：学生总分悟道", "rows": 6, // 作答行数 "lingqiPerCell": 1, // 每题灵气 "colNames": ["姓名", "语文", "数学", "英语", "公式（必填）", "结果（自动）"], "requiredFormulaCells": ["E2","E3","E4","E5","E6","E7"], // 公式列必填 "requiredResultCells": ["F2","F3","F4","F5","F6","F7"], // 结果列 "data": [ // 表格原始数据 {"A2":"张三","B2":85,"C2":92,"D2":78}, {"A3":"李四","B3":76,"C3":88,"D3":90}, {"A4":"王五","B4":90,"C4":85,"D4":89}, {"A5":"赵六","B5":88,"C5":95,"D5":92}, {"A6":"孙七","B6":79,"C6":82,"D6":80}, {"A7":"周八","B7":92,"C7":88,"D7":95} ], "formulaAnswer": { // 正确公式（考公式写法） "E2":"=SUM(B2:D2)", "E3":"=SUM(B3:D3)", "E4":"=SUM(B4:D4)", "E5":"=SUM(B5:D5)", "E6":"=SUM(B6:D6)", "E7":"=SUM(B7:D7)" }, "resultAnswer": { // 正确结果（验证计算） "F2":255,"F3":254,"F4":264,"F5":275,"F6":241,"F7":275 } }; // ************************** 【核心】通用函数规则配置（新增函数只加这里！） ************************** const funcRules = { // SUM函数：求和 SUM: { reg: /^SUM\((.+)\)$/, parse: (param) => { const cellList = parseCellParam(param); return cellList.reduce((total, cellId) => { const val = Number(document.getElementById(cellId)?.value || 0); return total + (isNaN(val) ? 0 : val); }, 0); } }, // COUNT函数：统计数字单元格个数 COUNT: { reg: /^COUNT\((.+)\)$/, parse: (param) => { const cellList = parseCellParam(param); return cellList.filter(cellId => { const val = Number(document.getElementById(cellId)?.value || 0); return !isNaN(val) && val !== ""; }).length; } }, // AVERAGE函数：求平均值 AVERAGE: { reg: /^AVERAGE\((.+)\)$/, parse: (param) => { const cellList = parseCellParam(param); const validVals = cellList.map(cellId => Number(document.getElementById(cellId)?.value || 0)).filter(val => !isNaN(val)); return validVals.length === 0 ? 0 : (validVals.reduce((t, v) => t + v, 0) / validVals.length); } } // 新增函数示例：加COUNTIF只需在这里加配置 // COUNTIF: { // reg: /^COUNTIF\((.+),(.+)\)$/, // parse: (param) => { // 写COUNTIF的解析逻辑 // } // } }; // ************************** 全局修仙状态 ************************** let totalLingqi = 0; let correctCount = 0; const totalCount = xianQuestion.requiredFormulaCells.length; const answeredCells = new Set(); // ************************** 初始化 ************************** window.onload = function() { document.getElementById("total").innerText = totalCount; renderXianTable(); bindFormulaEvent(); }; // ************************** 渲染修仙表格 ************************** function renderXianTable() { const tbody = document.getElementById("table-body"); const { data } = xianQuestion; data.forEach((item, index) => { const tr = document.createElement("tr"); const rowNum = index + 2; // 行号 tr.innerHTML = `<td>${rowNum}</td>`; // A-D列：姓名/语文/数学/英语 for (let col of ["A","B","C","D"]) { const cellId = col + rowNum; const value = item[cellId] || ""; tr.innerHTML += `<td><input type="text" class="cell" id="${cellId}" value="${value}" readonly></td>`; } // E列：公式（必填） const formulaCellId = "E" + rowNum; tr.innerHTML += `<td class="col-formula"><input type="text" class="cell" id="${formulaCellId}" placeholder="输入公式，如=SUM(B2:D2)"></td>`; // F列：结果（自动计算，只读） const resultCellId = "F" + rowNum; tr.innerHTML += `<td class="col-result"><input type="text" class="cell" id="${resultCellId}" readonly></td>`; tbody.appendChild(tr); }); } // ************************** 绑定公式列校验事件 ************************** function bindFormulaEvent() { const { requiredFormulaCells, formulaAnswer, resultAnswer, lingqiPerCell } = xianQuestion; requiredFormulaCells.forEach(cellId => { const formulaInput = document.getElementById(cellId); const resultCellId = "F" + cellId.slice(1); const resultInput = document.getElementById(resultCellId); formulaInput.addEventListener("blur", function() { const userFormula = this.value.trim().replace(/\s+/g, ""); const correctFormula = formulaAnswer[cellId].replace(/\s+/g, ""); const correctResult = resultAnswer[resultCellId]; if (userFormula !== correctFormula) return; // 通用公式解析：适配所有配置的函数 const calcResult = parseFormula(userFormula); const finalResult = Math.round(calcResult * 100) / 100; if (finalResult === correctResult && !answeredCells.has(cellId)) { resultInput.value = finalResult; handleWudao(cellId, resultCellId, lingqiPerCell); } }); // 手机端回车校验 formulaInput.addEventListener("keydown", function(e) { if (e.key === "Enter") this.blur(); }); }); } // ************************** 通用公式解析入口（适配所有函数） ************************** function parseFormula(inputVal) { if (!inputVal.startsWith("=")) return Number(inputVal); const formula = inputVal.slice(1).replace(/\s+/g, ""); // 匹配所有配置的函数 for (const [funcName, rule] of Object.entries(funcRules)) { if (rule.reg.test(formula)) { const match = formula.match(rule.reg); // 执行对应函数的解析逻辑 return rule.parse(match.slice(1).join(",")); } } // 解析基础算术（+ - × /） if (/[\+\-\*\/]/.test(formula)) { const calcStr = formula.replace(/[A-Z]\d+/g, cellId => { const val = Number(document.getElementById(cellId)?.value || 0); return isNaN(val) ? 0 : val; }); try { return eval(calcStr); } catch(e) { return NaN; } } // 纯数字 return Number(formula); } // ************************** 通用单元格参数解析（拆分区域/单个单元格，复用所有函数） ************************** function parseCellParam(param) { return param.split(/[:|,]/).flatMap(item => { item = item.trim(); // 处理区域：B2:D2 → 拆分为单个单元格 if (item.includes(":")) { const [start, end] = item.split(":").map(i => i.trim()); return getCellRange(start, end); } // 单个单元格：B2 return [item]; }); } // ************************** 单元格区域解析（复用） ************************** function getCellRange(start, end) { const cellList = []; try { const [sCol, sRow] = [start.match(/[A-Z]/)[0], Number(start.match(/\d+/)[0])]; const [eCol, eRow] = [end.match(/[A-Z]/)[0], Number(end.match(/\d+/)[0])]; const colToNum = col => col.charCodeAt(0) - 65; const numToCol = num => String.fromCharCode(num + 65); for (let c = colToNum(sCol); c <= colToNum(eCol); c++) { for (let r = sRow; r <= eRow; r++) { cellList.push(numToCol(c) + r); } } } catch (e) {} return cellList; } // ************************** 悟道成功处理（修复DOM，保留公式内容） ************************** function handleWudao(formulaCellId, resultCellId, lingqi) { const formulaInput = document.getElementById(formulaCellId); const resultInput = document.getElementById(resultCellId); const formulaTd = formulaInput.parentElement; const resultTd = resultInput.parentElement; const modal = document.getElementById("wudao-modal"); answeredCells.add(formulaCellId); // 更新灵气和题数 totalLingqi += lingqi; correctCount += 1; document.getElementById("lingqi").innerText = `${totalLingqi} 灵气`; document.getElementById("correct").innerText = correctCount; // 公式列：添加标记（不修改innerHTML，保留公式） formulaInput.classList.add("cell-correct", "wudao"); if (!formulaTd.querySelector(".formula-mark")) { const mark = document.createElement("span"); mark.className = "formula-mark"; mark.innerText = "📜"; formulaTd.appendChild(mark); } // 结果列：添加标记 resultInput.classList.add("cell-correct", "wudao"); if (!resultTd.querySelector(".correct-mark")) { const mark = document.createElement("span"); mark.className = "correct-mark"; mark.innerText = "✓"; resultTd.appendChild(mark); } // 弹窗提示 modal.innerText = `悟道成功！+${lingqi}灵气`; modal.classList.add("show"); setTimeout(() => modal.classList.remove("show"), 2000); // 通关判断 if (correctCount === totalCount) { setTimeout(() => { alert(`🎉 恭喜道友通关！共获得 ${totalLingqi} 灵气，境界更进一层！`); }, 500); } }

「表格悟道」学习工具，专为计算机小白、职场新人、学生及家庭用户打造，核心优势在于彻底打破学习门槛，让表格技能学习变得普惠、便捷又有趣：

1. 零门槛上手，小白也能轻松学

工具完全贴合「零基础」认知逻辑，摒弃复杂的专业术语和操作，以「修仙闯关」的趣味形式拆解表格核心函数（SUM/COUNT/AVERAGE/COUNTIF/SUMIF 等），从基础求和到条件统计，每一步都有即时反馈和可视化提示，不用懂代码、不用记复杂规则，跟着引导就能掌握日常办公 / 生活高频用到的表格技能。

2. 摆脱电脑束缚，手机端随时随地学

无需依赖电脑、无需安装复杂软件，只要有手机就能学 —— 适配手机屏幕的表格布局、可视化点选操作（无需手动敲公式）、横向滚动的适配设计，不管是通勤路上、休息间隙，还是居家碎片时间，打开手机就能练，把「等车、午休、睡前」的零散时间变成实用技能的学习窗口。

3. 普惠全家，覆盖多场景实用需求

技能学习不局限于职场，更能普惠全家：

对学生：轻松掌握成绩统计、分数段分析，搞定作业和学习中的数据整理；
对收银员 / 小店主：快速学会销售额求和、客单价计算、某类商品 / 某时段营收统计，用表格理清生意账；
对家庭用户：整理家庭收支、记录孩子成绩、统计日常开销，用简单的表格技能打理生活；
对长辈：简化的操作逻辑、大字体 + 清晰反馈，不用怕学不会，轻松掌握基础数据整理能力。

4. 即时反馈 + 正向激励，越学越有成就感

不同于传统枯燥的视频 / 文字教程，工具以「灵气积累、关卡通关」的游戏化形式，每答对一道题、掌握一个公式，都能获得即时的正向反馈，既降低了学习的挫败感，又能让使用者在成就感中稳步提升，真正做到「学了能用、用了就会」，把表格技能变成人人都能掌握的生活 / 工作小帮手。

从家庭收支整理到职场基础数据统计，从孩子学习辅助到小店生意记账，这款工具让原本「有门槛」的表格技能，变成人人可学、随时能练、全家受用的普惠技能，真正做到「让技术服务普通人，让学习温暖一家人」

阿雪技术观

在科技发展浪潮中，我们不妨积极投身技术共享。不满足于做受益者，更要主动担当贡献者。无论是分享代码、撰写技术博客，还是参与开源项目维护改进，每一个微小举动都可能蕴含推动技术进步的巨大能量。东方仙盟是汇聚力量的天地，我们携手在此探索硅基生命，为科技进步添砖加瓦。

Hey folks, in this wild tech - driven world, why not dive headfirst into the whole tech - sharing scene? Don't just be the one reaping all the benefits; step up and be a contributor too. Whether you're tossing out your code snippets, hammering out some tech blogs, or getting your hands dirty with maintaining and sprucing up open - source projects, every little thing you do might just end up being a massive force that pushes tech forward. And guess what? The Eastern FairyAlliance is this awesome place where we all come together. We're gonna team up

查看全文

http://www.jsqmd.com/news/360050/