基础语法：变量、类型、运算与模板字符串
从最基础的数据声明开始，理解 JavaScript 如何保存、计算和输出信息。
PAGE 02DOM 操作：选择元素、修改内容与样式
掌握页面交互的核心：用 JS 找到元素，并动态修改文字、类名、属性和样式。
PAGE 03事件处理：点击、输入、键盘与事件委托
事件是 JS 交互的入口，本页把常见事件和事件委托放在一个小菜单中练习。
PAGE 04表单校验：必填、邮箱、手机号与错误提示
网站最常见的功能之一：提交前验证用户输入，并给出清晰提示。
PAGE 05数组渲染：列表、map、filter 与 reduce
把数组数据渲染成页面列表，是前端开发最常见的数据展示方式。
PAGE 06对象与 JSON：配置、深拷贝、接口数据
很多接口返回的都是 JSON，理解对象结构可以帮助你处理真实项目数据。
PAGE 07函数、作用域、闭包与回调
函数是组织代码的关键，本页用计数器和工厂函数理解闭包。
PAGE 08条件判断与循环：状态驱动界面
通过订单状态练习 if、switch、for、forEach，以及状态到 UI 的映射。
PAGE 09定时器：倒计时、轮询、节流与防抖
定时器常用于倒计时、自动保存、延迟搜索、轮播和定期刷新。
PAGE 10异步请求：Promise、async/await 与请求状态
用模拟 API 理解 loading、success、error 三种状态，这是接口开发的基本模型。
PAGE 11本地存储：localStorage 与 sessionStorage
在浏览器里保存用户设置、草稿、购物车，是非常实用的 JS 场景。
PAGE 12模块化思维：拆分工具函数与页面逻辑
即使是普通 HTML，也应该学习模块化：把工具、数据、渲染、事件拆清楚。
PAGE 13错误处理与调试：console、try/catch、边界判断
学会看错误和防止错误，比记 API 更重要。
PAGE 14常见 UI：Tabs、Modal、Accordion
很多网页交互都由基本 UI 组件组成：选项卡、弹窗和折叠面板。
PAGE 15轮播与图片画廊：索引、边界和自动播放
轮播的核心不是动画，而是当前索引、上一张、下一张、边界处理。
PAGE 16搜索、筛选、排序与分页
电商列表、文章列表、后台表格都会用到：搜索、筛选、排序、分页。
PAGE 17CRUD 实战：Todo / 任务管理
通过增删改查练习事件、数组、渲染、localStorage，这是综合练习页面。
PAGE 18滚动效果：IntersectionObserver 滚动淡入
现代页面常见的 Scroll Reveal 可以用 IntersectionObserver 高效实现。
PAGE 19响应式菜单：移动端导航与展开收起
移动端汉堡菜单是非常实用的交互练习，涉及状态、class 和可访问性。
PAGE 20安全与性能：XSS、innerHTML、批量渲染
JS 写得能运行还不够，还要避免常见安全坑和性能坑。
PAGE 21拖拽排序：Drag & Drop API
拖拽排序常用于后台排序、图片排序、菜单排序，本页实现最小可用版本。
PAGE 22文件上传预览：图片、大小与类型校验
上传图片前先预览和校验，是后台、表单、产品图管理的常见功能。
PAGE 23URL 参数与 History：筛选状态可分享
把筛选条件写入 URL，用户刷新或分享链接时还能保留状态。
PAGE 24模板渲染与 data-* 属性
列表按钮需要知道当前项 ID 时，data-* 是非常常用、清晰的做法。
PAGE 25自定义事件与发布订阅：组件通信
页面变复杂后，不同模块之间需要通信，自定义事件是轻量方案。
PAGE 26日期时间与 Intl：格式化、倒计时、时区意识
订单、活动、展会、倒计时都离不开日期处理，本页练习原生 Date 和 Intl。
PAGE 27正则表达式与文本处理
正则适合校验、提取、替换，本页用邮件和链接提取练习常用写法。
PAGE 28Canvas 基础：绘制简单柱状图
Canvas 可以做图表、标注、小游戏和可视化，本页实现一个简单柱状图。
PAGE 29Web Components：自定义元素入门
不依赖框架，也可以封装自己的 HTML 标签，适合理解组件化思想。
PAGE 30购物车 / 询盘计算器综合练习
最后用一个小购物车把数组、事件、渲染、统计和状态管理串起来。