本次实践借助 CodeBuddy 完成了 Todo List 应用的自动化代码编写。在开发过程中，通过四轮精准的提示词（Prompt）交互，成功引导 AI 实现了核心功能。四轮提示词如下：
第一步：请根据以下需求生成一个index.html文件的页面骨架：页面名称为"Hello AI Todo"，需要包含三个区域，一个标题区域显示应用名称，一个输入区域包含文本输入框和“添加”按钮，用于输入新任务，一个列表区域用于展示人物列表。请使用语义化的HTML5标签，如<header><main><section>等，划分区域，并为后续的样式和脚本添加必要的id或class属性。代码只需包含基本结构，不需要填充具体的内容或功能。
第二步：现在请为页面生成基础的CSS样式（写入style.css文件）。要求如下：将页面整体居中显示，设置合适的最大宽度；美化标题的字体大小和颜色，使其突出；使输入区域的文本框和按钮在同一行，并适当留出间距；为人物列表及列表项提供基本样式，例如去除默认列表样式、增加间距和边框以区分各个任务项。请使用简洁的CSS实现上述布局和样式。
第三步：创建一个main.js脚本，使用原生JavaScript实现以下功能：当用户单击ID为“添加”的按钮时，首先获取ID为“task-input”的输入框内容。如果内容不为空，则创建一个新的<li>元素，将输入文本作为该元素的文本节点，并将其添加到ID为“task-list”的<ul>列表中。最后清空输入框内容。请确保脚本在DOM完全加载后执行，可以使用DOMContentLoaded事件或将脚本放在body末尾来实现。代码应包含完整的错误处理，确保在元素不存在时不会报错。
第四步：<ul>列表中的元素增加标题，事情名称和完成情况列，每一条内容名称后增加一个可以打对号的方框，点击方框打上对号，再次点击对号取消。
