本书以项目驱动为核心，采用“理论—实践—应用”三位一体框架，系统讲解 JavaScript前端开发技术。全书共设四大模块十个实战项目：基础入门模块（项目1~2）、核心进阶模块（项目3~4）、前端交互模块（项目 5~8）、工具与前沿模块（项目 9~10）。每个项目均构建“学习目标—项目导引—知识准备—项目实现—项目小结—理论测试—实训内容”完整学习过程，兼顾理论讲解与动手实践，帮助学习者循序渐进掌握JavaScript，具备独立开发前端交互项目的能力。
本书适合作为高职院校各专业 Web 开发课程的先导教材，也可供 IT 技术爱好者自学使用，还可作为教师教学参考资料。

JavaScript作为网页交互的核心语言，在网页开发、移动应用、大数据可视化等领域应用广泛，市场对掌握JavaScript技能的人才需求持续增长。然而，许多初学者在入门阶段常面临诸多困境：部分教材偏重理论堆砌，缺少真实应用场景，导致学完难以动手开发；部分教材知识体系零散，从基础语法到DOM、BOM再到框架的过渡生硬，学习者难以形成系统的开发能力。同时，行业技术迭代加速，jQuery等实用框架仍是企业开发常用工具，AI辅助开发等前沿技术也逐步融入开发流程，传统教材往往滞后于行业实践，无法满足学习者对实用技能与前沿知识的双重需求。
为解决上述问题，本书以“项目驱动”为核心理念，围绕10个贴近实际开发的项目构建完整知识体系，既兼顾零基础读者对基础语法的学习需求，又为进阶读者夯实函数、面向对象等核心能力，同时融入DOM、BOM实战及jQuery、AI辅助开发等内容，形成“理论—实践—应用”的学习闭环，帮助读者高效掌握 JavaScript 技能，适应行业发展需求。
全书共设四大知识模块：基础入门模块（项目1~2），以交互式网页名片、数字商品橱窗等案例，初识JavaScript并详解语法基础；核心进阶模块（项目3~4），通过购物车结算、商品库存管理等项目，讲解函数应用与面向对象思想；前端交互模块（项目5~8），借助宿舍信息页、计算器、异常页面、视频播放页，系统讲解DOM与BOM操作；工具与前沿模块（项目9~10），以校园二手平台项目为载体，介绍jQuery框架与AI辅助开发技术。
每个项目均设计“学习目标—项目导引—知识准备—项目实现—项目小结—理论测试—实训内容”完整学习闭环，理论与实践并重，逻辑清晰、实用性强，帮助学习者循序渐进掌握JavaScript，最终具备独立开发前端交互项目的能力。
本书由张趁香、刘小芬、张书锋任主编，陆正、陈俊贤、朱春雷任副主编。在编写与整理过程中，得到了多家单位的大力支持，相关企业提供了丰富的项目案例与宝贵建议。在此特别感谢甲骨文软件研发中心（北京）有限公司上海分公司、苏州市亿盟软件信息技术有限公司、苏州格拉尼视觉科技有限公司等单位的专家提供技术支持。
由于编者水平有限，书中疏漏与不足之处在所难免，敬请广大读者批评指正。
编 者
2026年1月

模块1 基础入门模块
项目1 交互式网页名片
——JavaScript初探2
   学习目标2
   项目导引2
   知识准备3
1.1 JavaScript概述3
1.1.1 JavaScript的简介3
1.1.2 JavaScript的主要特点3
1.1.3 JavaScript组成4
1.1.4 JavaScript工作原理4
1.1.5 JavaScript相关应用5
1.2 JavaScript开发工具7
1.2.1 使用记事本编辑
JavaScript程序7
1.2.2 使用Dreamweaver编辑JavaScript程序7
1.2.3 使用HBuilder编辑JavaScript程序9
1.3 JavaScript使用方法10
1.3.1 行内式10
1.3.2 内部式11
1.3.3 外部式12
1.4 JavaScript常用语句13
1.4.1 注释语句13
1.4.2 输出语句14
   项目实现15
   项目小结17
   理论测试17
   实训内容18
项目2 数字商品橱窗展示
——JavaScript语言基础19
   学习目标19
   项目导引19
   知识准备20
2.1 输入输出语句20
2.1.1 prompt()20
2.1.2 window.alert()?20
2.1.3 ?console.log()21
2.1.4 document.write()21
2.2 关键字和标识符21
2.2.1 关键字21
2.2.2 标识符22
2.3 数据类型22
2.3.1 数值型22
2.3.2 字符串型23
2.3.3 布尔型24
2.3.4 特殊数据类型24
2.4 常量与变量26
2.4.1 常量的定义26
2.4.2 变量的定义与命名26
2.4.3 变量的声明与赋值26
2.4.4 变量的作用域28
2.5 表达式与运算符29
2.5.1 表达式29
2.5.2 运算符29
2.6 基本语句33
2.6.1 赋值语句33
2.6.2 分支结构语句33
2.6.3 循环结构语句38
   项目实现40
   项目小结45
   理论测试45
   实训内容45
模块2 核心进阶模块
项目3 购物车结算
——函数及其应用48
   学习目标48
   项目导引48
   知识准备49
3.1 函数基础49
3.1.1 函数定义49
3.1.2 函数参数50
3.1.3 函数返回值50
3.2 函数运用51
3.2.1 函数调用51
3.2.2 函数嵌套53
3.3 函数扩展54
3.3.1 内置函数54
3.3.2 函数表达式56
   项目实现57
   项目小结60
   理论测试60
   实训内容60
项目4 商品库存管理
——类与对象61
   学习目标61
   项目导引61
   知识准备62
4.1 对象与类62
4.1.1 对象简介62
4.1.2 自定义对象
—Object对象63
4.1.3 自定义对象
—字面量赋值64
4.1.4 类与对象65
4.2 内置对象65
4.2.1 Math对象65
4.2.2 Date对象69
4.2.3 String对象73
4.2.4 数组对象77
4.3 自定义类82
4.3.1 构造函数82
4.3.2 实例方法83
4.3.3 对象类型检测84
4.3.4 继承85
   项目实现87
   项目小结93
   理论测试94
模块3 前端交互模块
项目5 会员信息页面制作——DOM基础96
   学习目标96
   项目导引96
   知识准备97
5.1 DOM概述97
5.1.1 什么是DOM97
5.1.2 DOM树97
5.1.3 DOM的节点类型99
5.1.4 DOM树的节点间的关系99
5.2 查找DOM节点100
5.2.1 getElementById()获取
页面元素100
5.2.2 getElementsByName()102
5.2.3 getElementsByTagName()103
5.2.4 获取元素子节点105
5.2.5 获取元素父、兄弟节点107
5.2.6 获取元素样式108
5.2.7 QuerySelector和QuerySelectAll110
5.3 DOM节点操作114
5.3.1 创建节点114
5.3.2 节点操作116
   项目实现119
   项目小结122
   理论测试122
   实训内容123
项目6 简易计算器制作
——DOM进阶124
   学习目标124
   项目导引124
   知识准备125
6.1 DOM事件125
6.1.1 鼠标事件125
6.1.2 键盘事件128
6.1.3 表单事件131
6.2 事件特性136
6.2.1 事件绑定136
6.2.2 事件冒泡137
6.2.3 事件委派140
   项目实现141
   项目小结144
   理论测试144
   实训内容145
项目7 网站异常页面制作
——BOM基础146
   学习目标146
   项目导引146
   知识准备147
7.1 BOM简介147
7.1.1 什么是 BOM147
7.1.2 BOM的组成148
7.2 window对象149
7.2.1 window对象的主要属性149
7.2.2 操作窗口150
7.3 screen对象152
7.3.1 screen对象的主要属性153
7.3.2 screen对象的主要事件154
7.4 location对象155
7.4.1 location对象的主要属性155
7.4.2 QueryString156
7.5 交互对话框158
7.5.1 alert对话框158
7.5.2 confirm对话框159
7.5.3 prompt对话框160
   项目实现161
   项目小结164
   理论测试164
   实训内容165
项目8 视频播放页面制作
——BOM进阶166
   学习目标166
   项目导引166
   知识准备167
8.1 定时器167
8.1.1 setInterval167
8.1.2 setTimeout168
8.1.3 应用案例：
定时跳转页面169
8.2 navigator对象171
8.2.1 navigator对象的
主要属性171
8.2.2 应用案例：
获取用户环境172
8.3 history对象174
8.4 页面生命周期176
8.4.1 页面生命周期总览176
8.4.2 应用案例：
视频播放专注机制176
   项目实现179
   项目小结183
   理论测试183
   实训内容183
模块4 工具与前沿模块
项目9 校园二手平台交互优化
——jQuery初探186
   学习目标186
   项目导引186
   知识准备187
9.1 jQuery简介187
9.1.1 什么是jQuery187
9.1.2 jQuery的优势188
9.1.3 获取与引入jQuery189
9.1.4 jQuery的基本使用190
9.2 jQuery选择器190
9.2.1 基本选择器190
9.2.2 层级选择器194
9.3 jQuery操作196
9.3.1 属性操作197
9.3.2 内容操作199
9.3.3 元素操作200
   项目实现202
   项目小结206
   理论测试206
   实训内容207
项目10 校园二手平台智能开发——AI辅助JavaScript生成208
   学习目标208
   项目导引208
   知识准备209
10.1 AI代码生成工具209
10.1.1 常见AI代码生成工具209
10.1.2 AI代码生成工具的
使用流程210
10.2 无码化开发工具211
10.2.1 常见无码化开发工具211
10.2.2 无码化开发工具的
核心优势211
   项目实现212
   项目小结215
   理论测试215
   实训内容215

张趁香，女，副教授，高级工程师，河南许昌人，毕业于江南大学，目前任职于苏州软件服务外包职业学院，长期从事软件开发C#程序设计、ASP.NET程序设计教学工作。刘小芬，硕士研究生，讲师工程师，毕业于东南大学。曾就职于甲骨文（中国）软件系统有限公司，从事软件测试工作。目前任职于苏州软件服务外包职业学院，担任JavaScript程序设计、鸿蒙应用开发等课程教学工作。发表论文2篇：《鸿蒙系统架构及应用程序开发研究》、课程思政与JavaScript程序设计课程教学融合研究》，主持校级课题3项并完成结项，江苏省技能大赛软件测试赛项优秀指导教师。主持与参与国家资源库课程建设2门。参编教材1本。张书锋，工程硕士，高级工程师，具有十多年软件开发及企业培训经验，曾先后就职于郑州华信职业技术学院专任教师，苏州铭星科技有限公司Java高级软件工程师，苏州市电脑人才培训中心高级讲师、学术经理、项目经理等职位。2015年加入苏州工业园区服务外包职业学院，从事软件技术专业教学和科研工作，已发表核心期刊3篇（2篇1作1篇2作），申报和参与纵向项目8项（主持1项，参与7项），申报和参与横向项目8项（主持3项，参与5项），申请和参与发明专利4项（第一完成人2项，参与2项），实用新型2项且已授权，研究方向：计算机软件设计、开发及其理论研究以及互联网应用。

书中每个项目均设计“学习目标—项目导引—知识准备—项目实现—项目小结—理论测试—实训内容”完整学习闭环，理论与实践并重，逻辑清晰、实用性强，帮助学习者循序渐进掌握JavaScript，最终具备独立开发前端交互项目的能力。