HTML5+CSS3+JavaScript(教学大纲)
《HTML5+CSS3+JavaScript》教学大纲
一、课程的性质、目的与任务
《HTML5+CSS3+JavaScript》是专业中一门综合性很强的基础课程,主要内容包括三个模块,第一部分讲解HTML5中新添加的元素、重要的API 的使用方法和应用技巧。第二部分讲述CSS3相关内容,包括选择器、盒样式、背景和动画的实现过程和方法。第三部分介绍JavaScript语言的内容,包括基础语法、函数、重要对象、DOM和事件的应用方式。笔者针对每个模块重要、实用的部分进行讲解,通过功能描述,实现代码,页面效果,源码分析等形式多方面展示各知识点的特性及功能,并将其与实际应用紧密联
系,希望学生能够通过学习进一步深化对知识点的理解;同时,每个章节均提供了丰富的示例代码。
本课程的目的与任务是使学生通过本课程的学习,从HTML5新增元素使用的方法的入手,由浅入深学习页面开发的各种相关知识,学会页面开发的相关关键技术,能够掌握常见的页面内容的研发技能,同时通过实践学习页面开发三种语言的基本功能与应用,以梳理知识脉络和要点的方式,让学生掌握前端页面开发的相关思想。本课程除要求学生掌握页面开发的基础知识和理论,重点要求学生学会分析问题的思想和方法,为更深入地学习和今后的实践打下良好的基础。
二、教学目标与教学基本要求
1. 拥抱HTML5
了解构建HTML 5页面的环境搭建步骤,理解并掌握HTML 5页面的基本特征,能够使用样式美化HTML5页面。
2. HTML5中新增交互元素
了解HTML 5中新交互元素的使用方法,理解details元素的使用,熟练menu元素的用法。
3. HTML5中的重要元素
熟练并掌握文档元素的使用方法,了解脚本和文本层次元素的使用方法,理解元素公共属性的使用方法。
4. HTML5中的表单
掌握表单中新增input元素类型的使用,了解表单新元素的使用方法,熟悉表单中新增属性的使用过程。
5. HTML5中的文件
掌握选择上传文件的使用方法,了解并理解文件读取与拖放的过程,熟悉文件读取时的错误与异常的处理。
6. HTML5中的视频和音频
掌握多媒体元素基本属性的使用方法,掌握并理解多媒体元素常用方法的使用,熟悉多媒体元素重要事件的应用过程。
7. HTML5绘图基础
理解并掌握画布元素的基础知识,掌握画布使用路径和操作图形的方法,理解并掌握画布绘制图像和文字的过程。
8. HTML5中的数据存储
理解Web Storage的基本概念,掌握Web Storage中对象的功能,掌握Web Storage API的使用方法。
9. HTML5中的离线应用
掌握cache manifest 文件的创建和功能,理解applicationCache 对象的基础概念,掌握applicationCache 对象中API的应用。
10.其他应用API
掌握Web Sockets API的使用方法,了解Web Workers API的实现方式。
11.HTML5中元素的拖放
熟悉并理解元素拖放的原理和实现,掌握dataTransfer对象的使用方法,能编写一个简单的元素拖放示例。
12.CSS3的概念
了解CSS3基本概念,掌握CSS3的语法和使用,掌握CSS3的模块结构和应用。
13.选择器
了解CSS3中选择器的基本概念,掌握CSS3中各属性选择器的使用方法,掌握CSS3中各结构性伪类选择器的使用方法。
14.选择器在页面的应用
理解并掌握使用伪元素选择器插入文字的方法,了解使用伪元素选择器插入图片的方法,熟悉使用伪元素选择器显示有序编号的方法。
15.文字相关的样式
理解文本阴影的实现方法和作用,掌握文本阴影各个属性值对应功能和实现方法,理解并掌握文本换行的各类方法。
16.盒相关样式
理解并掌握盒子类型基础知识,掌握盒子内容溢出显示处理的方法,了解盒子阴影实现的原理和过程。
17.背景和边框样式
理解并掌握背景相关样式的原理和用法,掌握圆角边框的使用方法,了解和掌握图片边框的原理和用法。
18.CSS3中的变形处理
理解和掌握transform属性中各变形函数的使用方法,掌握复合变形的原理和实现方法,了解transform-origin属性的使用方法。
19.CSS3中的动画属性
理解并掌握transition属性的原理和实现方法,掌握animation属性的原理和执行动画方法,了解并掌握在CSS3中自定义动画的过程。
20.布局相关样式
理解并掌握盒布局的原理和实现方法,了解并掌握盒布局中改变子元素排列方向和显示顺序的方法,理解盒布局中消除子元素空白区域的方法。
21.简介
理解并掌握JavaScript的功能,熟悉JavaScript的开发工具,能手动编写一个简单的JavaScript程序。
22.语法基础
理解并掌握变量和常量的定义方法,掌握数据类型和运算符的使用,熟练类型转换和代码注释的方法。
23.流程控制
理解并掌握流程控制的原理和组成,掌握选择结构的使用方法,熟练循环结构的使用方法。
24.初识函数
理解并掌握函数的原理和定义方法,理解并掌握函数的原理和定义方法,能编写一个实现简单功能的函数。
25.字符串对象
理解并掌握字符串获取的方法,了解字符串替换和分割的方法,掌握字符串查询和检索的方法。
26.数组对象
理解并掌握数组对象的定义和赋值,掌握数组对象中添加和删除元素方法,熟悉数据对象排序的方法和步骤。
27.日期对象
掌握日期对象的定义和取值方法,熟悉日期对象获取年月日的方法,能编写一个使用日期对象的示例。
28.数学对象
理解数学对象的功能和组成部分,熟悉数学对象中取整运算的方法,了解数学对象中生成随机数和三角函数的方法。
29.DOM基础
理解并掌握DOM对象的概念和组成,掌握DOM对象中获取和插入元素方法,了解DOM对象中复制和删除元素方法。
30.DOM进阶
理解DOM元素属性的操作方法,掌握DOM元素样式属性操作方法,熟悉查找DOM元素的方法。
31.事件基础
理解并掌握事件的概念和调用方式,了解鼠标和键盘事件的应用,熟练表单和页面事件的应用。
32.事件进阶
理解并掌握事件的处理机制和内部流程,掌握事件对象的使用方法,了解在事件中this对象的使用方法。
33.window对象
理解并掌握对象的常用方法,掌握对象中定时器方法的使用,了解对象中location对象的常用方法。
34.document对象
熟悉对象中的方法和属性,掌握对象中方法的应用场景,掌握对象中属性的使用过程。
三、教学方法
本课程教学方法以教师为主导的启发式讲授教学法为主,讨论(提问)式教学为辅,结合课外学习的教学方法。以学生动手为主,教师的启发式讲授教学法为辅,并结合讨论(提问)式教学,以及结合课外学习的教学方法。
1.教学形式以讲授方式为主,多媒体PPT为辅助的教学方法。
2.概念、定义和原理解释时,应通俗易懂,增加教学的直观性。
3.教学过程中注意各个知识点的关联性,使学生更好地理解课程内容。
4.对课程中关键性概念、设计思想方面的问题可辅以课堂讨论的形式。
5.为强化学生写代码能力,每章课后应安排作业,帮助学生学习和应用。
四、教学安排
五、课程要求
1. 做好课前预习,预习时以教材为主,了解相关的概念、定义、原理。预习中认真思考,以便带着问题主动地听课。
2. 课后要复习,有余力的学生复习时还应多动手编写代码,加强代码理解能力,认真整理课堂听课笔记。
3. 要求学生课外自主学习,学生课外阅读的参考资料应围绕本课程的知识点和技术需求进行展开。
4. 认真完成第章节所布置的作业。
六、考核内容及方式
本课程成绩由平时成绩和期末考核成绩组合而成,课程成绩以百分制计算,分配比例如下:
1. 平时成绩占30%,主要考查作业的完成程度,理论课和实验课的出勤率,实验课的考试结果。其中作业占10%,实验占15%,出勤率占5%。
2. 期末成绩占70%,采用考试的考核方式。考试采用闭卷形式,题型为选择题、正确/错误题、填空题、简答题,以及应用题。
七、持续改进
本课程根据学生作业、课堂讨论、平时考核情况和学生、教学督导等反馈,及时对教学中不足之处进行改进,并在下一轮课程教学中改进。