知达AI助教zida.school
创作者
Mm
Mm
1
0
4
前往知达做同款 生成一个单文件 HTML 游戏：淡黄背景，居中显示一段 60 字以内的小学语文短文，AI 随机埋 3 个错别字，字号 24 px。学生用鼠标点选错别字，点中即红圈标注并自动跳到下一处，找全 3 个弹出‘全部找出’，限时 30 秒倒计时，时间到显示‘再试一次’按钮。全程无图片依赖，代码加行内注释，方便老师改错别字库。
以下是一个符合要求的单文件 HTML 小学语文错别字识别游戏，完全内联（无外部依赖），淡黄背景、居中排版、24px 字号，含随机埋错、红圈标注、倒计时、逐个跳转、完成提示与重试功能。代码已添加清晰的行内中文注释，便于教师后续修改错别字库和短文内容。
代码生成中...
知达任务回放中错别字寻踪游戏设计案例
代码
预览
// 逐条应用替换（从后往前替换
，避免索引偏移）
for (let i = 0; i < shuffled
.length; i++) {
const rule = shuffled[i];
const idx = text.indexOf
(rule.target);
if (idx === -1) continue;
//
若原文无该字，跳过（教
师需确保存在）
positions.push(idx);
replacements.push(rule
.replacement);
//
替换第一个匹配处（保证唯
一性）
text = text.slice(0, idx) +
rule.replacement + text
.slice(idx + 1);
}
return { displayedText: text,
positions, replacements,
originalChars: shuffled
.map(r => r.target) };
}
// 步骤2：渲染带点击区域的HTML
（每个字包裹span，错字加cla
ss）
