设计界面布局
用HTML创建页面结构:顶部标题栏、笔记输入区(标题+内容)、添加按钮和笔记列表展示区。
用 HTML、CSS 和 JavaScript 制作一个功能完整的网页记事本,支持添加、编辑、删除和本地保存笔记。你将学习 DOM 操作、事件监听和 localStorage 本地存储。
电脑、文本编辑器 等 4 种
共 4 种材料
用HTML创建页面结构:顶部标题栏、笔记输入区(标题+内容)、添加按钮和笔记列表展示区。
用HTML创建页面结构:顶部标题栏、笔记输入区(标题+内容)、添加按钮和笔记列表展示区。
用CSS设计现代风格界面:卡片式笔记列表、渐变背景、悬浮阴影效果、响应式布局适配不同屏幕。
用CSS设计现代风格界面:卡片式笔记列表、渐变背景、悬浮阴影效果、响应式布局适配不同屏幕。
用JavaScript获取输入内容,动态创建笔记卡片DOM元素并添加到列表中,每条笔记显示标题、内容和时间。
用JavaScript获取输入内容,动态创建笔记卡片DOM元素并添加到列表中,每条笔记显示标题、内容和时间。
为每条笔记添加删除按钮和编辑按钮,点击删除移除DOM元素,点击编辑将内容回填到输入框修改后保存。
为每条笔记添加删除按钮和编辑按钮,点击删除移除DOM元素,点击编辑将内容回填到输入框修改后保存。
使用localStorage将笔记数据以JSON格式保存在浏览器中,页面加载时自动读取并显示已保存的笔记。
使用localStorage将笔记数据以JSON格式保存在浏览器中,页面加载时自动读取并显示已保存的笔记。
添加笔记搜索过滤、按时间排序、笔记分类标签、双击确认删除等功能,提升应用实用性。
添加笔记搜索过滤、按时间排序、笔记分类标签、双击确认删除等功能,提升应用实用性。
还没有探索记录
完成后上传作品,成为第一个记录的人。

纸板机器人手偶
用纸板和铆钉制作一个关节可动的机器人手偶,通过手指操控实现各种动作。你将学习简单机构和联动原理,理解机器人关节的运动方式。
4
种材料
0
人完成
0
投币
安全提醒
制作或观察时请确认环境安全,必要时在成人或老师陪同下完成。
电脑
文本编辑器
VS Code推荐
浏览器
应用界面设计草图
用HTML创建页面结构:顶部标题栏、笔记输入区(标题+内容)、添加按钮和笔记列表展示区。
用CSS设计现代风格界面:卡片式笔记列表、渐变背景、悬浮阴影效果、响应式布局适配不同屏幕。
用JavaScript获取输入内容,动态创建笔记卡片DOM元素并添加到列表中,每条笔记显示标题、内容和时间。
为每条笔记添加删除按钮和编辑按钮,点击删除移除DOM元素,点击编辑将内容回填到输入框修改后保存。
使用localStorage将笔记数据以JSON格式保存在浏览器中,页面加载时自动读取并显示已保存的笔记。
添加笔记搜索过滤、按时间排序、笔记分类标签、双击确认删除等功能,提升应用实用性。
用纸板和铆钉制作一个关节可动的机器人手偶,通过手指操控实现各种动作。你将学习简单机构和联动原理,理解机器人关节的运动方式。