Web客户端编程(Web前端开发技术)
Web客户端编程(Web前端开发技术)
5000+ 人选课
更新日期:2025/05/28
开课时间2025/02/16 - 2025/07/15
课程周期22 周
开课状态开课中
每周学时-
课程简介

2024年,《Web前端开发技术-HTML5、CSS3、JavaScript(第4版·题库·微课视频版)》入选江苏“十四五”普通高等教育本科省级规划教材,同时该教材入选清华大学出版社2024最受欢迎计算机类图书奖。

荣获“2019-2023年度科技类图书最受欢迎作者奖”、“2023年科技类畅销新书奖”。

2021年,Web前端开发技术-HTML5、CSS3、JavaScript(第3版)》荣获首批江苏省优秀本科培育教材、2022年清华大学出版社“科技类最受高校欢迎教材奖”。同时第4版教材入选国家级实验教学示范中心联席会计算机学科组十四五规划教材。

本课程教学主要围绕前端开发的三大基础脚本语言HTML5、CSS3、JavaScript进行展开。

 

                                   Web前端开发技术简介

  第一阶段讲解HTML。HTML主要是为网页创建和其它可在网页浏览器中所见到的信息设计的一种标记语言为搭建网页结构做出第一步本阶段主要介绍了HTML的语法基础、表格、表单、等标签,并有案例结合,达到学以致用。通过这一阶段的学习,您可以制作出简单的具有丰富元素的网页,以下两个案例插入了列表、文字、超链接、多媒体文件等各种元素。

        


项目3-1 简易灯箱画廊                      项目3-2 多媒体及滚动字幕网页设计效果


第二阶段讲解CSS。CSS是一种定义样式结构如字体、颜色、位置等样式的脚本语言,被用来为页面装饰效果(美化外在表现,即“化妆”)。本阶段主要介绍了CSS的基础语法、选择器、文本、背景、列表、盒子模型、浮动、定位以及网页的布局方式。另外学生掌握结合使用DIV+CSS技术进行网页布局的基本方法,下面的案例分别采用了DIV+CSS及表单两种布局方法。

                  项目5-2 设计《2015年CERNET华东北地区年会》网站                 项目7-2 大学生暑期社会调查表页面

 第三阶段讲解JavaScript。JavaScript是一种解释性脚本语言,主要用来向HTML页面添加交互行为。本阶段主要带领大家学习JavaScript的基本语法、流程控制语句、函数、对象、DOM、BOM、事件以及轮播图的案例,实现网页的交互效果。另外学生理解对象的概念及使用JavaScript来进行开发、维护、管理和设置Web应用程序,如案例11-1所示。

      

                           实训11-1 校园办公系统认证页面

 通过课程学习,使学生拥有初步的前端开发能力,能够制作简单的具有交互功能的网页,为下一阶段的学习打下良好的基础。


课程大纲

课程教学大纲

  • 1.1 第4版-56学时教学大纲
  • 1.2 第3版-56学时教学大纲
  • 1.3 第3版-64学时教学大纲

第一单元 Web前端开发技术概述与HTML基础

  • 2.1 第1章 Web前端开发技术综述
  • 2.2 第2章 HTML基础
  • 2.3 实训1-Web前端开发环境配置与HTML基础
  • 2.4 练习与实验答案1-2
  • 2.5 测验1-第1章单元测验
  • 2.6 测验2-第2章单元测验
  • 2.7 第1讲-教学PPT

第二单元 格式化文本1

  • 3.1 第 3章 格式化文本与段落
  • 3.2 第4章 列表
  • 3.3 实训2-格式化文本、段落与列表
  • 3.4 练习与实验答案3-4
  • 3.5 测验3-第3章单元测验
  • 3.6 测验4-第4章单元测验
  • 3.7 第2讲-教学PPT

第三单元 格式化文本2

  • 4.1 第5章 超链接与浮动框架
  • 4.2 第6章 图像与多媒体文件
  • 4.3 实训3-超链接与多媒体文件应用
  • 4.4 练习与实验答案5-6
  • 4.5 测验5-第5章单元测验
  • 4.6 测验6-第6章单元测验
  • 4.7 第3讲-教学PPT

第四单元 CSS+DIV基础

  • 5.1 第7章 CSS基础
  • 5.2 第8章 DIV与SPAN
  • 5.3 实训4- DIV+CSS综合运用
  • 5.4 练习与实验答案7-8
  • 5.5 测验7-第7-8章单元测验
  • 5.6 第4讲-教学PPT

第五单元 CSS+DIV高级应用

  • 6.1 第9章 CSS样式属性
  • 6.2 第10章 DIV+CSS页面布局
  • 6.3 实训5- DIV+CSS布局规划
  • 6.4 测验8-第9-10章单元测验
  • 6.5 练习与实验9-10
  • 6.6 第5讲 教学PPT

第六单元 表格

  • 7.1 第11章 表格
  • 7.2 实训6-表格与表格布局
  • 7.3 测验9-第11章单元测验
  • 7.4 练习与实验答案11
  • 7.5 第6讲 教学PPT

第七单元 表单

  • 8.1 第12章 表单
  • 8.2 实训7-表单页面设计资源
  • 8.3 测验10-第12章单元测验
  • 8.4 练习与实验答案12
  • 8.5 第7讲 教学PPT
  • 8.6 期中考试-第8周

第八单元 JavaScript基础1

  • 9.1 第14章 JavaScript基础(1)
  • 9.2 实训9-JavaScript基础资源
  • 9.3 案例视频-例14-1-1使用JavaScript 向HTML 页面输出信息
  • 9.4 案例视频-例14-1-2在head 标记内定义两个JavaScript 函数
  • 9.5 案例视频-例14-1-3调用外部js文件中的JavaScript函数
  • 9.6 第8讲教学PPT

第九单元 JavaScript基础2

  • 10.1 第14章 JavaScript基础(2)
  • 10.2 第3版 实训10资源
  • 10.3 练习与答案答案14
  • 10.4 测验11-第14章单元测验
  • 10.5 第9讲 教学PPT

第十单元 JavaScript事件分析

  • 11.1 第15章 JavaScript事件
  • 11.2 第3版 实训11资源
  • 11.3 测验12-第15章单元测验
  • 11.4 练习与答案答案15
  • 11.5 案例视频-例15-6-1综合实例
  • 11.6 第10讲 教学PPT

第十一单元 DOM与BOM

  • 12.1 第16章 DOM与BOM
  • 12.2 第3版 实训12资源
  • 12.3 测验13-第16章单元测验
  • 12.4 练习与答案答案16
  • 12.5 第11讲 教学PPT

第十二单元 HTML5基础与CSS3应用1

  • 13.1 第13章 HTML5基础
  • 13.2 第12讲 教学PPT
  • 13.3 第3版 实训8资源

第十三单元 HTML5基础与CSS3应用2

  • 14.1 第13章 HTML5基础-表单和音视频标记
  • 14.2 第13讲 教学PPT

第十四单元 HTML5基础与CSS3应用3

  • 15.1 第13章 CSS3应用
  • 15.2 第14讲 教学PPT
  • 15.3 练习与答案答案13
  • 15.4 测验14-第13章单元

第十五单元 复习

  • 16.1 第一课时 复习1
  • 16.2 第二课时 复习2
  • 16.3 第3版教材-模拟试卷1
  • 16.4 第3版教材-模拟试卷2
  • 16.5 第3版教材-模拟考试1答案
  • 16.6 第3版教材-模拟考试2答案

课外阅读