第四单元 飞机大战
第15课 F12 排错：期望与实际
前端排错本册收齐：F12 打开 Console，对照「我期望 / 实际看到」，再改一处。
卡住很正常——真正玩家也会卡关，作者更会。
别空想，去看线索：期望是什么、实际看见什么，差在哪一行。
修好一处再往前，比重写整局更快。
一、这一课怎么学
- 开始前你要会：会打开浏览器，会打字。
- 怎样算做完：完成「轮到你做」，并在嵌入工具里留下可预览文件。
- 建议：先读「弄懂这件事」，再做练习。
二、学完你能做到
- 会打开 F12 看 Console。
- 能写最小复现三句。
- 求助时不甩锅给 AI。
三、弄懂这件事
这一课就这几小步：
1．F12 Console（本册必会）
卡住别空想：按 F12（或右键→检查）打开开发者工具，先看 Console 红字。
纯前端游戏排错，Console 是主战场；Network 留给下册接接口再用。
有红字先读懂它在抱怨什么（拼错名、找不到按钮等），再动手改——这项技能上册收齐，不推下册。
2．最小复现
报问题写成三句：我做了什么 → 看见什么 → 期望什么。
三句话说清，自己和 AI 才对得上同一现象。
说不清现象，就容易改错 HTML/CSS/JS 哪一层。
3．求助话术
对 AI：请只修发射键无效，不要重写整局；修好后我自己再点验。
修好一处再往前，比重写整局更快。
四、先跟着做
对照例子想清楚
用自己的话重述本课成功标准。
做对了会怎样你写出来的标准，别人打开页面点几下就能核对是不是做到了，而不是只有形容词。
指出哪一步必须自己点，不能听 AI 口头说完成。
做对了会怎样你明确写出：必须自己打开页面点一遍；AI 口头说「完成了」不能算数。
五、轮到你做
避坑卡
故意制造一个小错误，用 F12 找到线索。
做对了会怎样把控制台或报错里的红字关键词记下来再改。
做不出来怎么办检查是否拼错函数名或按钮 id。
写最小复现三句。
做对了会怎样步骤写清到别人照着做也能完成。
做不出来怎么办对照：按空格应出现子弹；没有就记现象再修。
按复现请 AI 只改一处并核验。
做对了会怎样指出的问题在预览里已经修好，能再点一遍确认。
做不出来怎么办对 AI 限令写：禁止整页重写，只改指定一处。
用下面嵌着的氛围编程工具。写完在工具里看预览，文件是
show/l15.html。做对了会怎样在嵌着的工具预览里，你能亲眼看见本课要求的按钮、分数或流程文字，而不是只有说明。
做不出来怎么办先在预览里自己点一遍；文件名必须和例子上写的完全一样，改完再刷新预览。
本节例子
下面整段是给 AI 的提示词示例：写清目标、范围和怎样算做成；请整段使用，不要只丢半句。工具嵌在下方。本课文件是 show/l15.html。
做单个 HTML，标题「F12 避坑卡」。这是求助说明页，不是游戏。 三栏写清：我做了什么；我看见什么（含报错或异常现象）；我期望什么。 页底附一句向 AI 求助的模板：只改一处、不要重写整页。 排版清楚；不要服务器。 输出要求：必须用 ```html 文件名 给出完整可运行 HTML（含 <style> 与需要的 <script>），不要只回复说明，不要只贴 CSS/JS 片段。页面打开后要立刻看得见内容，不要只有标题和大空框。
正在打开氛围编程工具…若长时间空白请强制刷新。
六、小心这些错
不看红字反复让 AI 重写。
复现写成「坏了你看着办」。
七、带走这几句
- 先打开 F12 看线索，再让 AI 改，别盲目重写。
- 报修时先最小复现：只保留能复现问题的那几步。
八、打勾再往下
- 我会开 Console。
- 我有避坑卡。
小测验
对照上面「学完你能做到」选一个答案，再点「检查」。
卡住第一步更该？
最小复现包含？
求助时更好？