原创源码练习 · 让读者知道本页动作进行到哪一步
9.1免费版代码状态反馈
任务清单用原生复选框表达完成与待完成，添加、删除和恢复时同步更新完成数与文字状态。9.1免费版代码是检索线索；本例只处理当前页面内存，没有进度计时、后台任务或持久保存。
用9.1免费版代码相关的原创任务清单练习添加、完成、删除与恢复，核对checkbox、完成数与role=status，并说明刷新后恢复初始任务。
直接答案
9.1免费版代码状态反馈
任务清单用原生复选框表达完成与待完成，添加、删除和恢复时同步更新完成数与文字状态。9.1免费版代码是检索线索；本例只处理当前页面内存，没有进度计时、后台任务或持久保存。
按顺序操作
具体操作步骤
- 打开status-feedback，确认初始两项待完成任务与0 / 2完成数。
- 输入“补充表格caption”，点击“添加任务”或按Enter，核对清单变为三项。
- 勾选新增任务，核对已完成徽标、删除线、1 / 3完成数及状态文字。
- 取消勾选，再删除该任务，核对完成数与删除后的焦点位置。
- 点击“恢复两项初始任务”，确认原始名称、0 / 2及输入清空。
- 再做一次添加后刷新，确认回到初始两项；代码没有保存或网络同步。
从两项初始任务开始
页面初始显示“给页面补充清晰的主标题”和“检查表单 label 与 id”两项任务，完成数为0 / 2。脚本初始化后启用复选框、添加和恢复按钮，并为每项任务加入删除操作。每项只有待完成与已完成两种状态；完成数是复选框计数，不是模拟进度百分比。
添加名称与数量的边界
任务名称先去掉首尾空白，需为1–60个字符，清单最多20项。点击“添加任务”或在输入框按Enter会增加一项，清空输入并把焦点留在输入框。空名称或超长名称给出提示，达到20项时要求先删除。任务文字通过createElement与textContent建立，不拼成HTML执行。
复选框、徽标与完成数一致
勾选任务后，行样式添加done、徽标改成“已完成”，完成数增加；取消勾选则恢复“待完成”。颜色与删除线是辅助提示，任务状态还有明确文字。完成操作保持焦点在复选框，role="status"区域播报一条变化与当前完成数，不强行把焦点移到状态文字。
删除与恢复安排好下一步焦点
每个删除按钮有包含任务名称的aria-label。删除后脚本优先把焦点移到下一项复选框，没有下一项时使用上一项；清空清单时移回任务名称输入。点击“恢复两项初始任务”会移除当前清单、重建最初两项、清空输入并重新显示0 / 2。它不会撤回服务器数据，因为没有服务器接入。
刷新回到初始值，不承诺保存
本例没有账号、同步或localStorage，任务仅在当前页面内存中。刷新后恢复两项初始任务。若自己扩展为持久保存，需要另写存储字段、键名、清除与失败处理；file URL下的localStorage行为没有统一保证。任务添加完成也不表示联网业务或团队待办服务已经建立。
相关字段比较
| 动作 | 实际变化 | 数据范围 |
|---|---|---|
| 添加 | 清单增加一项，输入清空 | 名称1–60字符，最多20项 |
| 完成或恢复待完成 | 复选框、徽标、完成数同步 | 只修改当前清单 |
| 删除 | 移除任务并安排邻近焦点 | 没有远端删除 |
| 恢复初始任务 | 重建两项，显示0 / 2 | 清空本页改动 |
| 刷新 | 重新初始化两项任务 | 没有跨次保存 |
数据透明度
技术参考与说明依据
这些公开文档用于解释网页元素和 API，不代表本站已经执行外部产品实测，也不确认某个 9.1 产品的身份。
常见问题