课程定位与学习门槛

《JavaScript交互式网站实战开发》是一门专为具备HTML/CSS基础及JavaScript基本语法的开发者打造的进阶实战课。本课程跳过基础语法讲解，直击Web开发中最核心的两大能力：前后端数据交互与字符串高效处理。只要你理解函数、对象和DOM操作的基本概念，即可无障碍入门。课程旨在帮助你打破静态页面的局限，真正掌握构建动态、数据驱动型网站的技术栈。

学习顺序与核心内容

课程逻辑严密，分为两条紧密关联的主线：

第一阶段聚焦于Ajax数据交互体系。学习从服务器环境搭建开始，深入理解HTTP请求的本质与流程。通过封装原生Ajax库，你将从底层理清异步编程的逻辑。随后，课程进入实战环节，完整实现登录注册系统，涵盖表单三要素校验、后端数据提交以及常见的乱码问题排查。在此基础上，课程横向拓展至跨域解决方案，详细对比JSONP、CORS、WebSocket及postMessage四种技术的原理与适用场景，让你在面对复杂的网络请求时能做出精准的技术选型。

第二阶段转向正则表达式实战。在获取数据后，如何清洗和处理数据同样关键。课程通过敏感词过滤、多余空格去除、小说格式整理等真实业务场景，将抽象的正则语法转化为可落地的代码能力，极大提升代码的健壮性与执行效率。

资料包使用建议

配套资料包提供了各章节的关键代码片段与环境配置参考。请务必避免直接复制文件名或照搬代码。建议采用“理解逻辑先行，对照检查在后”的策略：先跟随视频讲解独立编写代码，遇到瓶颈时再打开资料包对照关键节点，重点分析差异原因，特别是Ajax库封装的结构设计和跨域配置的细节处理。

学完产出

完成本课后，你将具备以下能力：

  1. 独立搭建调试环境，熟练处理复杂的Ajax异步请求与跨域问题。
  2. 能够从零封装轻量级的Ajax与JSONP工具库，减少对重型框架的依赖。
  3. 独立开发包含用户鉴权、数据校验的完整前后端交互功能模块。
  4. 灵活运用正则表达式解决文本清洗、格式校验等高阶数据处理需求。

这门课是前端开发者从入门走向进阶的关键一步，建议在理解原理的基础上反复动手实践。

课程目录

1-1 [数据交互] Ajax数据交互简介 (06:57).mp4
 1-2 [数据交互] 服务器环境搭建与配置 (06:34).mp4
 1-3 [数据交互] Ajax交互流程和注意问题 (23:01).mp4
 1-4 [数据交互] 使用Ajax实现百度新闻 (21:06).mp4
 1-5 [数据交互] Ajax交互流程和库封装 (28:47).mp4
 1-6 [数据交互] Ajax登录注册之表单三要素 (09:14).mp4
 1-7 [数据交互] Ajax注册功能实现 (20:50).mp4
 1-8 [数据交互] Ajax登录功能实现 (02:51).mp4
 1-9 [数据交互] Ajax登录注册之核心功能实现 (14:18).mp4
 1-

10 [数据交互] Ajax登录注册之乱码问题解决 (05:01).mp4
 1-

11 [数据交互] 进阶版Ajax库封装 (24:40).mp4
 1-

12 [数据交互] Ajax库进阶版实际应用 (06:54).mp4
 1-

13 [数据交互] 跨域介绍 (05:33).mp4
 1-

14 [数据交互] jsonp跨域方式介绍 (10:42).mp4
 1-

15 [数据交互] jsonp百度搜索提示功能实现 (10:44).mp4
 1-

16 [数据交互] jsonp库封装 (21:20).mp4
 1-

17 [数据交互] CORS跨域方式介绍 (05:45).mp4
 1-

18 [数据交互] CORS的跨域实现流程 (19:28).mp4
 1-

19 [数据交互] 使用WebSocket处理跨域 (23:39).mp4
 1-

20 [数据交互] postMessage原理和实现 (10:47).mp4
 2-1 [正则表达式] 为什么需要正则表达式？ (07:35).mp4
 2-2 [正则表达式] 正则是什么及其特性 (17:59).mp4
 2-3 [正则表达式] 正则应用-敏感词过滤 (12:59).mp4
 2-4 [正则表达式] 正则应用-去除多余空格 (07:00).mp4
 2-5 [正则表达式] 正则应用-小说格式整理 (07:27).mp4
 2-6 [正则表达式] 正则应用-座机校验 (12:21).mp4
 2-7 [正则表达式] 正则应用-邮箱校验 (07:21).mp4
 2-8 [正则表达式] 正则知识总结 (07:09).mp4
 3-1 [ES6的应用] ES6的前世今生 (03:30).mp4
 3-2 [ES6的应用] 新的变量声明方式 (06:23).mp4
 3-3 [ES6的应用] 字符串模板引擎 (01:51).mp4
 3-4 [ES6的应用] 变量的解构赋值 (03:47).mp4
 3-5 [ES6的应用] 箭头函数 (04:39).mp4
 3-6 [ES6的应用] 扩展运算符和rest运算符 (04:27).mp4
 3-7 [ES6的应用] 数组新方法 (03:44).mp4
 3-8 [ES6的应用] ES6数据结构 (25:56).mp4
 3-9 [ES6的应用] ES6的开发环境搭建 (05:47).mp4
 3-10 [ES6的应用] promise简介 (07:00).mp4
 3-11 [ES6的应用] promise与数据交互 (01:50).mp4
 3-12 [ES6的应用] async与异步编程 (01:52).mp4
 3-13 [ES6的应用] Proxy与数据劫持 (04:45).mp4
 3-14 [ES6的应用] 展望：ES7、ES8新特性 (03:04).mp4
 3-15 [ES6的应用] 面试常见ES6问题集锦 (02:38).mp4
 3-16 [ES6的应用] ES6项目小练习-TodoList (06:14).mp4
 4-1 [面向对象编程] 过程式编程VS面向对象编程 (04:26).mp4
 4-2 [面向对象编程] 如何进行面向对象编程 (03:22).mp4
 4-3 [面向对象编程] ES6的面向对象编程 (01:51).mp4
 4-4 [面向对象编程] 面向对象继承 (05:24).mp4
 4-5 [面向对象编程] 面向对象的应用 (05:52).mp4
 5-1 [模块化与组件化] 框架、库、插件、组件、模块都是什么？ (02:04).mp4
 5-2 [模块化与组件化] ES6模块化 (03:01).mp4
 5-3 [模块化与组件化] 使用jQuery进行开发 (04:46).mp4
 5-4 [模块化与组件化] 如何手写一个jQuery插件 (04:33).mp4
 5-5 [模块化与组件化] 使用Vue进行开发 (10:04).mp4
 5-6 [模块化与组件化] Vue组件编写 (03:29).mp4