别急着上框架，先补上这块“缺失的拼图”

很多人直接跳过 JavaWeb 去啃 Spring、MyBatis 等框架，结果遇到报错只能盲目搜索，因为根本不懂底层数据是如何在浏览器和服务器之间传输的。这门课的核心任务，就是填补你从“会写 Java 代码”到“能开发 Web 应用”之间的巨大能力缺口。它不教你如何搭建微服务架构，而是专注于解决一个最本质的问题：当用户在浏览器点击按钮时，后端到底收到了什么？前端页面又是如何被动态渲染出来的？如果你连表单提交的数据怎么解析、CSS 布局为何错乱、DOM 节点如何操作这些基础概念都一知半解，那么后续所有的框架学习都会变成空中楼阁。

这门课适合已经掌握 Java 基础语法，但从未深入接触过 Web 开发逻辑的学习者。你不需要精通前端，但必须理解前端“三剑客”是如何协同工作的。课程通过拆解 HTML 的结构构建、CSS 的样式控制以及 JS 的动态交互，让你明白 Web 页面的真实构成。特别是针对那些在复习时感到困惑的“盒子模型”原理、“浮动布局”的失效场景，以及 BOM 与 DOM 操作的区别，课程提供了针对性的讲解。学完这部分，你不再是那个只会复制粘贴代码的“调包侠”，而是能看懂浏览器如何与服务器对话的开发者。

先看这三块地基，再谈框架应用

建议按照以下顺序切入，这是构建 Web 认知的关键路径。首先必须攻克前端基础中的结构与样式部分，重点理解 HTML 表单的提交机制和 CSS 盒子模型。很多初学者在调试页面布局时，根本分不清元素是块级还是行内，导致无法定位样式冲突的根源。紧接着，必须深入 JavaScript 的核心，特别是 DOM 操作和 BOM 对象模型。这是前后端交互的“翻译官”，只有理解了如何通过 JS 获取页面元素、监听用户事件并操作数据，才能真正理解后续 Java 后端如何处理请求。

资料包中的代码示例是配合练习的核心，不要只看视频。每学完一个知识点，比如 CSS 浮动布局或 JS 的 DOM 遍历，都要尝试手动敲一遍代码，并故意制造一些错误（例如让浮动元素塌陷、让 DOM 节点获取失败），然后观察控制台报错和页面表现。通过这种“破坏性”的练习，你才能建立起对代码行为的直觉。不要试图一次性消化所有内容，遇到复杂的布局或脚本逻辑卡壳时，先暂停，回到基础概念去查证，确保每一个属性、每一个方法的作用都清晰可辨，再进入下一节。

学完能独立回答的实战问题

完成本阶段学习后，你应当能够独立回答并解决以下具体问题：为什么表单数据没有提交到后端？是因为 method 属性设置错误，还是 enctype 配置不当？页面样式错乱时，如何通过盒子模型理论判断是边距（margin）问题还是内边距（padding）问题？当需要修改页面上某个特定按钮的显示状态时，是应该操作 BOM 还是操作 DOM？

更重要的是，你将具备独立开发简单静态页面的能力，并能将其与后端 Java 代码进行初步对接。你可以清晰地描述一个用户请求从发起、浏览器渲染、JS 交互到服务器响应的完整生命周期。这种对 Web 底层机制的掌控力，是后续学习各种框架的前提。只有当你能解释清楚“为什么这样做”而不是“框架要求这样做”时，你的技术栈才算真正稳固，后续面对复杂的框架需求时，才能做到缺什么补什么，不再被黑盒代码困住。

课程目录

1-1 [前端基础内容] html介绍1-基本控件 (30:50)
1-2 [前端基础内容] html介绍2-表格等 (26:21)
1-3 [前端基础内容] html介绍3-表单等 (45:23)
1-4 [前端基础内容] css介绍1-选择器 (34:08)
1-5 [前端基础内容] css介绍2-常用属性 (15:49)
1-6 [前端基础内容] css介绍3-盒子模型 (26:01)
1-7 [前端基础内容] css介绍4-浮动-布局 (39:48)
1-8 [前端基础内容] js基础语法-ECMAScript (01:03:21)
1-9 [前端基础内容] js浏览器对象模型-bom (42:13)
1-10 [前端基础内容] js文档对象模型-dom1 (36:54)
1-11 [前端基础内容] js文档对象模型-dom2 (33:12)
1-12 [前端基础内容] js文档对象模型-dom3 (41:31)
1-13 [前端基础内容] jquery介绍-选择器 (52:16)
1-14 [前端基础内容] jquery介绍-事件-动画 (55:08)
1-15 [前端基础内容] jquery介绍-取/设值/追加 (34:08)
1-16 [前端基础内容] jquery介绍-追加/操作css (16:18)
1-17 [前端基础内容] jquery介绍-遍历1 (52:56)
1-18 [前端基础内容] jquery介绍-遍历2 (13:29)
1-19 [前端基础内容] jquery介绍-作业讲解 (22:50)
2-1 [javaweb基础部分] javaweb入门程序 (49:58)
2-2 [javaweb基础部分] javaweb-http协议 (29:14)
2-3 [javaweb基础部分] javaweb-get和post的区别 (14:38)
2-4 [javaweb基础部分] servlet的创建方式之一实现Servlet接口 (38:11)
2-5 [javaweb基础部分] servlet的创建方式之二继承HttpServlet类 (25:23)
2-6 [javaweb基础部分] servlet-登陆例子 (22:42)
2-7 [javaweb基础部分] HttpServletResponse介绍 (43:33)
2-8 [javaweb基础部分] HttpServletRequest介绍 (36:01)
2-9 [javaweb基础部分] 四大作用域介绍 (17:39)
3-1 [javaweb基础功能实现] jsp+servlet实现增加、查询、删除 (53:05)
3-2 [javaweb基础功能实现] jsp+servlet实现修改功能 (28:22)
3-3 [javaweb基础功能实现] jsp+servlet实现模糊查询 (17:40)
3-4 [javaweb基础功能实现] jsp+servlet实现批量删除 (19:22)
3-5 [javaweb基础功能实现] jsp和el表达式介绍 (55:39)
3-6 [javaweb基础功能实现] 复习 (10:39)
3-7 [javaweb基础功能实现] JSTL介绍(C标签) (56:20)
3-8 [javaweb基础功能实现] jsp+servlet+mysql实现分页功能 (01:13:10)
3-9 [javaweb基础功能实现] jsp+servlet实现搜索功能 (02:39:27)
4-1 [javaweb高级部分] cookie介绍 (01:07:46)
4-2 [javaweb高级部分] 本地cookie被清除问题 (02:11)
4-3 [javaweb高级部分] session介绍 (39:10)
4-4 [javaweb高级部分] 原生的ajax (50:18)
4-5 [javaweb高级部分] 原生的ajax补充 (02:01)
4-6 [javaweb高级部分] json和jquery_ajax介绍 (01:08:20)
4-7 [javaweb高级部分] md5加密 (24:45)
4-8 [javaweb高级部分] servlet之监听器 (47:22)
4-9 [javaweb高级部分] servlet之过滤器 (37:39)
4-10 [javaweb高级部分] servlet之过滤器应用 (14:49)
4-11 [javaweb高级部分] 后台模板修改 (46:16)