缺什么补什么：你的页面是死的还是活的
很多从 HTML 和 CSS 转过来的人，最容易卡在“页面是静态的”这个瓶颈上。你切图很漂亮，排版也符合标准，但只要用户一点击按钮，或者一提交表单，页面就毫无反应。这门 JavaScript 基础入门课解决的就是这个核心问题：怎么给写死的网页加上交互逻辑。它不会带你深入闭包底层原理或者复杂的异步编程，而是直接把你按在浏览器控制台和代码编辑器面前，教你用最基础的脚本去操作网页元素。适合那些已经能熟练写网页骨架和样式，但完全没碰过脚本语言，或者之前看语法书觉得太抽象、一写代码就大脑空白的技术学习者。如果你正处于前端转岗的阵痛期，或者需要快速查漏补缺补齐交互这块短板，建议先从“初识事件和 DOM”这块看起，这是让网页动起来的物理抓手，比死记变量类型更直观。
配套练习：别光看视频，去控制台把元素点出来
学这门课最忌讳的就是只看不动。JavaScript 的基础语法如果不结合具体的网页元素去练，跟背英语单词没区别。资料里的线索已经指明了方向：从在 VS Code 里建立脚本文件，到在浏览器的 Console 面板里直接敲代码验证。建议的练习方式是，自己先随便写一个包含按钮、输入框和 div 容器的静态页面，然后跟着视频去复现操作。比如讲到修改 CSS 属性值时，你立刻暂停视频，自己在编辑器里写一段脚本，点击按钮把 div 的背景色改掉，再去浏览器里刷新验证。讲到操作表单 Input 文本框时，试着写一个获取用户输入内容并用弹窗显示出来的小功能。资料里的代码片段和示例不是为了让你抄一遍，而是当作参照物，你要用它来对照自己写的逻辑哪里报错了，为什么没拿到元素的值，是不是页面还没加载完就去执行了脚本，从而理解 window.onload 这种加载时机的问题。
学完能独立做什么：交出一份能交互的表单页
看完这门课，你不一定能立刻去写复杂的工程化项目，但你能独立完成以前必须求助于后端或者别人才能做的页面交互。具体来说，你应该能独立写出一个完整的用户注册表单验证逻辑：当用户点击提交按钮时触发事件，读取各个 Input 文本框里的内容，判断是否为空，如果不符合要求就动态修改某个 div 容器的文字和 CSS 样式来显示红色的错误提示，如果符合要求再允许提交。你能清楚地回答几个关键问题：浏览器是如何解析执行这段脚本的？你怎么在代码里精准拿到页面上某个特定的标签？给按钮绑定点击事件的具体写法是什么？页面文档加载顺序和脚本执行顺序冲突时该怎么处理？把这些最底层的 DOM 操作和事件响应机制吃透，你就真正跨过了前端开发的门槛，后续再去学更高级的框架时，也能明白它们底层到底在替你封装什么操作。
课程目录
1-1 [初识JavaScript语言] 认识JavaScript语言 (18:23) 1-2 [初识JavaScript语言] 解释性脚本语言 (11:01) 1-3 [初识JavaScript语言] JavaScript发展史 (14:00) 1-4 [初识JavaScript语言] 在VS Code中写JavaScript (11:11) 1-5 [初识JavaScript语言] 在浏览器的Console中写JavaScript (08:09) 2-1 [初识事件和DOM] 响应按钮点击的事件 (11:25) 2-2 [初识事件和DOM] 操作表单中Input文本框 (19:04) 2-3 [初识事件和DOM] 操作div容器 (07:04) 2-4 [初识事件和DOM] 修改CSS属性值 (07:45) 2-5 [初识事件和DOM] 理解window.onload事件 (10:49) 2-6 [初识事件和DOM] 演示：div操作综合演练 (20:37) 2-7 [初识事件和DOM] 响应按钮点击事件的两种方法 (06:44) 2-8 [初识事件和DOM] 响应键盘事件 (20:10) 2-9 [初识事件和DOM] 响应Hover事件 (08:24) 3-1 [变量] 定义变量 (11:02) 3-2 [变量] 变量的命名 (11:28) 3-3 [变量] Number类型 (24:18) 3-4 [变量] 数据类型 (12:03) 3-5 [变量] String类型 (17:39) 3-6 [变量] 数据类型转换 (19:56) 3-7 [变量] 案例演示：进制转换 (22:15) 3-8 [变量] 时间日期的基本操作 (24:35) 4-1 [运算符] 算术运算符 (26:00) 4-2 [运算符] 赋值运算符 (25:54) 4-3 [运算符] 比较运算符 (15:03) 4-4 [运算符] 逻辑运算符 (09:11) 4-5 [运算符] 三元运算符 (12:39) 4-6 [运算符] 案例演示：计算生日是哪天？ (23:53) 5-1 [条件选择] If条件选择基本结构 (13:39) 5-2 [条件选择] 案例演示：统计各种字符的数量 (18:11) 5-3 [条件选择] 案例演示：通过键盘控制方块的移动 (19:25) 5-4 [条件选择] switch条件选择基本结构 (20:08) 6-1 [循环] while循环 (22:34) 6-2 [循环] do--while循环 (11:52) 6-3 [循环] 案例演示：计算纸的高度 (27:32) 6-4 [循环] for循环 (12:00) 6-5 [循环] 案例演示：复选框的使用 (30:07) 6-6 [循环] 循环嵌套的案例演示：打印三角形 (15:08) 6-7 [循环] 循环关键字：break和continue (14:22) 7-1 [综合案例演示：实现iPhone中的计算器] 计算器的页面布局 (33:22) 7-2 [综合案例演示：实现iPhone中的计算器] 批量响应点击事件 (15:30) 7-3 [综合案例演示：实现iPhone中的计算器] 实现基本的运算 (16:40) 7-4 [综合案例演示：实现iPhone中的计算器] 计算器运算的优化 (10:53) 7-5 [综合案例演示：实现iPhone中的计算器] 计算器功能的完善 (13:50) 8-1 [综合案例演示：轮播图] 轮播图的介绍和案例展示 (05:06) 8-2 [综合案例演示：轮播图] 轮播图的页面布局 (27:38) 8-3 [综合案例演示：轮播图] 实现基本的轮播 (23:18) 8-4 [综合案例演示：轮播图] 轮播功能的完善 (16:59) 9-1 [Array集合] 初识Array集合 (14:03) 9-2 [Array集合] 添加和删除元素 (16:47) 9-3 [Array集合] Array集合的遍历 (11:14) 9-4 [Array集合] 案例演示：随机生成数字 (38:05) 9-5 [Array集合] Array集合的常见方法 (16:32) 9-6 [Array集合] 案例演示：生成学生成绩(上) (32:31) 9-7 [Array集合] 案例演示：生成学生成绩(下) (34:38) 9-8 [Array集合] 使用forEach实现Array集合的遍历 (07:39) 10-1 [Set集合] 初识Set集合 (10:53) 10-2 [Set集合] Set集合的遍历 (06:29) 10-3 [Set集合] Set集合常见的方法 (15:26) 10-4 [Set集合] 案例演示：集合的逻辑运算 (36:18) 11-1 [Map集合] 初识Map集合 (14:58) 11-2 [Map集合] Map集合的问题讨论 (08:36) 11-3 [Map集合] Map集合常见的方法 (20:19) 11-4 [Map集合] Map集合的遍历 (11:00) 11-5 [Map集合] 案例演示：下拉框的联动(上) (25:19) 11-6 [Map集合] 案例演示：下拉框的联动(下) (25:33) 12-1 [第4季课程总结] 课程总结 (07:22)
